1

ASP MVC 3 ページで、jQuery.toggle()を使用して、ユーザーがクリックしたかどうかに基づいてテキスト ボックスを非表示および表示しようとしていますcheckbox。ページが読み込まれると、テキスト ボックスは非表示になります。ほとんどの場合、ユーザーはいくつかの別々のテキスト ボックスに値を入力し、Ajax 呼び出しはそのdiv要素の.text()プロパティ内に値を配置します。ユーザーがチェック ボックスをクリックすると、値がdiv消えてテキスト ボックスが表示されるようにします。

今のところ、divテキストを表示/再表示させることができます。ただし、textboxajax 呼び出しが以前に行われていない場合にのみ表示されます。

Ajax 呼び出しのコードを次に示します。

function getDrmTerritory(zipCode, stateCode, channelName) {
    $.ajax({
        type: 'POST',
        url: '@Url.Action("getTerritory","AgentTransmission")',
        data: { zipCode: zipCode, stateCode: stateCode, channelName: channelName },
        success: function (data) {
            if (data == "") {
                alert("No Territory Code for " + channelName + " located in " + stateCode + ", " + zipCode);
                $('#territoryName').text("");
                $('#Region').val("");
            } else {
                $('#Region').val(data);
                $('#territoryName').text(data);
                alert("Territory set to " + data);
                window.global = data;
            }
        },
        error: function (data) {
            alert("Territory did not get set, please review State/Zip/Market Segment");
        }
    });
}

そして、ここにありdivます。上記の Ajax 呼び出しは、この時点で非表示になっているため、テキスト自体ではdivなく、単にテキストを 内に配置することになっています。textbox

    <div class="M-editor-label">
        @Html.LabelFor(model => model.Region)
    </div>
    <div class="M-editor-field" id="territoryName">
        @Html.TextBoxFor(model => model.Region, new { style = "display: none;" })
        @Html.ValidationMessageFor(model => model.Region)
    </div>

この中の をクリックすることcheckboxdiv

    <div class="M-editor-label">
        Override Territory Manually?
    </div>
    <div class="M-display-field" style="padding-right:190px;padding-top:10px;">
        @Html.CheckBoxFor(Model => Model.OverrideRegionInd)
    </div>

この.click関数が呼び出されます (この関数は関数内にありdocument.readyます)。このクリック機能により、#Region TextBoxFor<>コントロールが再表示されます。ただし、前に述べたように、これはgetDrmTerritoryAjax 呼び出しが行われていない場合にのみ機能します。

    $('#OverrideRegionInd').click(function () {
        var region = $.trim($('#territoryName').text());
        if (region != "") {
            $('#territoryName').text("")
        } else {
            $('#territoryName').text(window.global);
        }
        $('#Region').toggle();
    });

編集

この.ajaxComplete呼び出しは、GetChannel()メソッドの後に毎回呼び出されるため、言及する必要があります。$('#territoryName').text("");行がページからテキスト ボックスを吹き飛ばしているように見えますが、そのdiv要素のテキストを消しTextBoxFor<>、同時にコントロールを維持する方法がわかりません。

$(document).ajaxComplete(function (event, xhr, settings) {
    if (settings.url == "/AgentTransmission/GetChannel") {
        var channel = $.trim($('#channelName').text());
        if ($('#AlignmentM:radio').is(':checked')) {
            if ($('#MailingZip').val() != "" && $('#MailingState').val() != "" && channel != "") {
                getDrmTerritory($('#MailingZip').val(), $('#MailingState').val(), channel);
            } else if (channel != "") {
                $('#territoryName').text("");
                $('#Region').val("");
            }
        }
        else if ($('#AlignmentL:radio').is(':checked')) {
            if ($('#LocationZip').val() != "" && $('#LocationState').val() != "" && channel != "") {
                getDrmTerritory($('#LocationZip').val(), $('#LocationState').val(), channel);
            } else if (channel != "") {
                $('#territoryName').text("");
                $('#Region').val("");
            }
        }
    }
});
4

1 に答える 1