0

我有一个 ASP.net 网络表单,其中填充了来自 MS SQL DB 的数据,并允许您编辑值。

Web 应用程序使用 Harvest Chosen 多选下拉列表 (max=1) 来选择从同一信息列表中挑选的两个不同的人,但在两个单独的控件上。

当我刷新页面时,有时两个控件都填充了正确的值,有时两者都没有或一个都没有。我在控制台中进行了测试,它肯定从数据库中提取了正确的信息,但我一定遗漏了与这些过程的执行方式有关的一些内容。过去,我使用 VB.NET 和 ASP 控制器完成了这项工作。这是我第一次使用 AJAX 和 web 方法功能。我相信我在某处错过了更新,或者不理解代码的执行顺序。

我尝试在 .aspx 页面中明确说明操作顺序,然后在执行完控制器的所有代码之前不执行更新触发器,但这似乎破坏了两个控制器(两者最终看起来像普通的选择控制器)。抱歉,如果我的术语不正确,我是自学成才的。我得到不一致的应用程序的代码的当前状态

.aspx 页面就是这样。每个控件都有一组不同的参数,这些参数会影响其填充方式以及更改时会发生什么。

<select class="chosen-select" multiple data-placeholder="Assign a scientist" name="ChosenScientist" style="width:800px;" id="cmbChosenScientist">
    <script type="text/javascript">
        handleChosenControls("select#cmbChosenScientist.chosen-select");
    </script>
</select>
<select class="chosen-select" multiple data-placeholder="Assign a supervisor" name="ChosenSupervisor" style="width:800px;" id="cmbChosenSupervisor">
    <script type="text/javascript">
        handleChosenControls("select#cmbChosenSupervisor.chosen-select");
    </script>
</select>

aspx 页面将控制器名称传递给一个函数,该函数首先定义控制器使用的所有参数。

function defineChosenControls(controller) {
    switch (controller) {
        case "select#cmbChosenScientist.chosen-select":
            currentData = JSON.stringify({ sqlQueryName: "studyScientist" + "/" + MainContent_txbStudy.value });
            populateData = JSON.stringify({ sqlQueryName: "userList" });
            changeData = JSON.stringify({ strControlName: controller, arrValues: JSON.stringify($(controller).val()), strArg1: MainContent_txbStudy.value });
            break;
        case "select#cmbChosenSupervisor.chosen-select":
            currentData = JSON.stringify({ sqlQueryName: "studySupervisor" + "/" + MainContent_txbStudy.value });
            populateData = JSON.stringify({ sqlQueryName: "userList" });
            changeData = JSON.stringify({ strControlName: controller, arrValues: JSON.stringify($(controller).val()), strArg1: MainContent_txbStudy.value });
            break;
    }
}

处理填充选项、设置当前值和处理更改的函数如下:

function handleChosenControls(controller) {
    //Purpose: Any time a Chosen control is loaded, changed, etc., this is run.
    defineChosenControls(controller);
    $(controller).chosen({ max_selected_options: 1 });

    //Script for populating the control
    $.ajax({
        type: "POST",
        url: "ClientToServer.aspx/GetDT",
        data: populateData,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (response) {
            for (line of JSON.parse(response.d)) {
                $(controller).append('<option value="' + line[Object.keys(line)[0]] + '">' + line[Object.keys(line)[0]] + '</option>');
            }
            $(controller).trigger("chosen:updated");
        },
        error: function (response) { console.log("ERROR: Unable to pass changed values from controller " + controller + " to server-side."); }
    });

    //Script for determining current value during load
    $.ajax({
        type: "POST",
        url: "ClientToServer.aspx/GetDT",
        data: currentData,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (response) {
            for (line of JSON.parse(response.d)) {
                $(controller).val(line[Object.keys(line)[0]]).trigger("liszt:updated");
                console.log(line[Object.keys(line)[0]]);
            }
            $(controller).trigger("chosen:updated");
        },
        error: function (response) { console.log("ERROR: Unable to retrieve current value of " + controller + " from server-side."); }
    });

    //Script for when a value in the control is changed
    $(controller).on('change', function (e) {
        defineChosenControls(controller);
        $.ajax({
            type: "POST",
            url: "ClientToServer.aspx/PassJqueryControlValue",
            data: changeData,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {
            },
            error: function (response) { console.log("ERROR: Unable to pass changed values from controller " + controller + " to server-side."); }
        });
    });
}

我希望这两个控件在数据库中都有正确的值,并且这些值正在浏览器控制台中正确写入,但是收获选择的控件是不一致的。

4

1 回答 1

0

解决方案是在加载后调用代码。

<script type="text/javascript">
$(window).bind("load", function() {
    handleChosenControls("select#cmbChosenScientist.chosen-select");
    handleChosenControls("select#cmbChosenSupervisor.chosen-select");
}); 

于 2019-05-23T19:10:07.863 回答