【问题标题】:MVC DropdownListFor html helper interferes with JQuery submit when @size specified当指定@size 时,MVC DropdownListFor html helper 会干扰 JQuery 提交
【发布时间】:2012-10-30 14:43:42
【问题描述】:

我对 MVC 的 html 帮助程序有一个奇怪的问题,因为当我为 @Html.DropdownListFor 指定 @size 时,它​​会阻止 jquery .submit 与服务器通信。关于可能导致这种情况的任何想法?有没有其他方法可以让下拉菜单变高?代码如下:

           @using (Ajax.BeginForm("CreateInProgress", "Audit", new AjaxOptions {     
HttpMethod = "POST", OnSuccess = "CreateInProgressSuccess" }, new { id = "CreateInProgressMainForm"}))
           {
              <div id="reqTabContentBox" class="formPageContainer">
                  @Html.HiddenFor(x => x.ConfigDoc.CreateApproveButton.ConfigurableLabelDesc)
                  @Html.HiddenFor(x => x.ConfigDoc.CreateDisapproveButton.ConfigurableLabelDesc)
                  @Html.HiddenFor(x => x.ConfigDoc.CreateSaveButton.ConfigurableLabelDesc)
                  @Html.HiddenFor(x => x.ConfigDoc.CreateAdvanceButton.ConfigurableLabelDesc)

                  @Html.Partial("_CreateAudit")
               </div>
                       @Html.DropDownListFor(x => x.AuditDoc.AuditTemplateId, new SelectList(Model.AuditDoc.AuditTemplates, "Id", "Name"), new { size = "6", @class = "left" })
              <div id="finalButtons" class="formPageContainer">
                 <input id="AdvanceDirection" name="AuditDoc.AdvanceDirection" type="hidden" value="Forward" />

                  <span class="field-validation-error" id="CreateFormValidation"></span>  
                  <span class="field-validation-success" id="CreateSaveSuccess"></span> 
                  @if(Model.AuditDoc.CurrentStates.StateName == "Active")
                  {
                    <div class="btnContainer">
                       <input type="button" id="SaveCreateInProgress" class="toggleAllSelectors" value="@Model.ConfigDoc.CreateSaveButton.ConfigurableLabelDesc" />
                       <input type="button" id="AdvanceCreateInProgress" class="toggleAllSelectors" value="@Model.ConfigDoc.CreateAdvanceButton.ConfigurableLabelDesc" /> 
                    </div>
                  }
                  else
                  {
                    <label>@Model.ConfigDoc.AllEnterPrivateCommentLabel.ConfigurableLabelDesc</label> @Html.TextAreaFor(x => x.AuditDoc.PrivateComment, 0, 0, false)

                    <div class="btnContainer">
                       <input type="button" id="DisapproveCreateInProgress" class="toggleAllSelectors" value="@Model.ConfigDoc.CreateDisapproveButton.ConfigurableLabelDesc" @Model.OwnerApprovalAttribute />
                       <input type="button" id="ApproveCreateInProgress" class="toggleAllSelectors" value="@Model.ConfigDoc.CreateApproveButton.ConfigurableLabelDesc" @Model.OwnerApprovalAttribute />
                    </div>
                  }
               </div>
           }

这是 jquery 提交:

$("#CreateAuditMainForm").submit();

这里是生成的 Html dropdownlistfor helper 代码:

<select class="left valid" data-val="true" data-val-number="The field AuditTemplateId must be a number." data-val-required="The AuditTemplateId field is required." id="AuditDoc_AuditTemplateId" name="AuditDoc.AuditTemplateId" size="6" style="display: block; "> ... </select>

如果有任何帮助或智慧之言,我将不胜感激!

【问题讨论】:

  • 任何 JS 错误?您能否也为下拉菜单发布生成的 HTML 代码?
  • 没有 JS 错误。下面是为 html 帮助程序生成的代码:
  • 嗯,看不出有什么问题。关于您的问题的标题,如果您不指定 size 属性,它 确实 起作用,对吗?在这种情况下,您能否扩展提供的 HTML 代码,使其包含表单和 JS 代码?
  • 我已经包含了表格。按钮类型是“按钮”,JS 代码调用 .submit jquery 来提交表单。是的,它在不使用 size 时有效。
  • 您已经找到答案了吗?最接近 size 属性的是在 CSS 中使用“height”。但这只会垂直增加盒子。另外,尝试在代码中从 size 更改为 @size。只是猜测。

标签: jquery asp.net-mvc html-helper html.dropdownlistfor


【解决方案1】:

我不知道这是否是问题的原因,但是通过“选择”字段上提供的 HTML,它并没有被关闭。也许这是搞砸了 DOM 结构,导致在 jquery 上提交表单时出错。 尝试编辑 html 并关闭选择字段并重试提交以查看会发生什么。

<select class="left valid" data-val="true" data-val-number="The field AuditTemplateId must be a number." data-val-required="The AuditTemplateId field is required." id="AuditDoc_AuditTemplateId" name="AuditDoc.AuditTemplateId" size="6" style="display: block; " />

让我们看看我们是否可以有一个幸运的猜测。 :P

问候。

【讨论】:

  • 我认为它没有关闭,因为 TheDude 没有包含 ,但我可能错了。
  • 尼克是正确的。它确实有一个结束,我只是没有将它包含在帖子中。
猜你喜欢
  • 1970-01-01
  • 2011-06-06
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-04-02
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多