1

在我的 ASP MVC 3 页面中，我尝试使用 jQuery.toggle()根据用户是否单击来隐藏和显示文本框checkbox。当页面加载时，文本框被隐藏。大多数时候，用户会将值放入几个单独的文本框中，而 Ajax 调用会将值放入该div元素的.text()属性中。当用户单击复选框时，我希望其中的任何值div都消失，并出现文本框。

现在，我可以让div文本出现/重新出现就好了。但是，textbox只有在之前没有进行 ajax 调用时才会出现。

这是来自 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>

通过单击checkbox此div

    <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<>控件重新出现。但是，就像我之前所说的，这仅在getDrmTerritory没有进行 Ajax 调用的情况下才有效。

    $('#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

2

您不应该设置 的文本div，您需要在span. 否则，div在此之后将删除 的内容：

$("#territoryName").text("");

而是替换它们以进行验证span：

$("#territoryName span").text("");

和

$('#territoryName span').text(data);
于 2013-05-01T10:39:20.853 回答