【问题标题】:set selected value of a asp dropdown with jquery使用 jquery 设置 asp 下拉列表的选定值
【发布时间】:2013-05-16 18:35:42
【问题描述】:

当显示模式弹出窗口时,我正在尝试使用 jquery 设置下拉值。 我正在尝试一些静态数据,但没有任何成功。 这就是我所拥有的:

$(document).on("click", ".open-EditSplitAgent", function () {
              var first = $(this).data('first');
              var last = $(this).data('last');
              var splitPC = $(this).data('splitpc');
              var id = $(this).data('id');
              $('#<%=txtFirstEdit.ClientID%>').val(first);
              $('#<%=txtLastEdit.ClientID%>').val(last);
              $('#<%=hfLifeID.ClientID%>').val(id);              
              $("#ddlAgentPercEdit").val('0.50');             
              $('#editSplitAgent').modal('show');
          });

下拉列表具有以下值:

  <asp:DropDownList ID="ddlAgentPercEdit" runat="server">
                                   <asp:ListItem Value="">Select Percentage</asp:ListItem>
                                 <asp:ListItem Value="0.50">0.5</asp:ListItem>
                                 <asp:ListItem Value="0.75">0.75</asp:ListItem>
                                 <asp:ListItem Value="0.9">0.01</asp:ListItem>
                                 <asp:ListItem Value="0.7">0.7</asp:ListItem>
                                 <asp:ListItem Value="0.1">0.1</asp:ListItem>
                                 <asp:ListItem Value="0.8">0.8</asp:ListItem>
                                 <asp:ListItem Value="0.6">0.6</asp:ListItem>
                                 <asp:ListItem Value="0.9">0.9</asp:ListItem>
                                 <asp:ListItem Value="0.05">0.05</asp:ListItem>
                                 <asp:ListItem Value="0.95">0.95</asp:ListItem>
                             </asp:DropDownList>

当显示模式弹出窗口时,我的文本框和隐藏字段具有正确的值。 正如您在 jquery 事件中看到的那样,我正在尝试使用静态数据,这样我就可以看到它对静态数据的工作正常,但最初我需要将 splitPC var 值分配给下拉值。 提前感谢您的建议, 拉齐亚莱

编辑: 模态弹出窗口的渲染代码:

        <div class="modal hide fade" tabindex="-1" role="dialog" id="editSplitAgent">
 <div class="modal-header">
    <button class="close" data-dismiss="modal">×</button>
    <h3>Edit Split Agent</h3>   
  </div>
    <div class="modal-body">       
        <div class="content">

              <div class="form-row row-fluid">
                      <div class="span12">
                          <div class="row-fluid">
                               <label class="form-label span4" for="tooltip">First Name</label>
                               <input name="ctl00$ContentPlaceHolder1$txtFirstEdit" type="text" id="ctl00_ContentPlaceHolder1_txtFirstEdit" class="span8 tip" />       
                                 <span id="ctl00_ContentPlaceHolder1_RequiredFieldValidator4" style="color:Red;display:none;"></span>
            <input type="hidden" name="ctl00$ContentPlaceHolder1$ValidatorCalloutExtender5_ClientState" id="ctl00_ContentPlaceHolder1_ValidatorCalloutExtender5_ClientState" />                                                        
                           </div>
                      </div> 
                </div>
                 <div class="form-row row-fluid">
                      <div class="span12">
                          <div class="row-fluid">
                               <label class="form-label span4" for="tooltip">Last Name</label>
                               <input name="ctl00$ContentPlaceHolder1$txtLastEdit" type="text" id="ctl00_ContentPlaceHolder1_txtLastEdit" class="span8 tip" />  
                                   <span id="ctl00_ContentPlaceHolder1_RequiredFieldValidator5" style="color:Red;display:none;"></span>
            <input type="hidden" name="ctl00$ContentPlaceHolder1$ValidatorCalloutExtender6_ClientState" id="ctl00_ContentPlaceHolder1_ValidatorCalloutExtender6_ClientState" />                                                         
                           </div>
                      </div> 
                </div>
             <div class="form-row row-fluid">
                      <div class="span12">
                          <div class="row-fluid">
                               <label class="form-label span4" for="tooltip">Agent Percentage</label>
                                 <div class="span8 controls">
                             <select name="ctl00$ContentPlaceHolder1$ddlAgentPercEdit" id="ctl00_ContentPlaceHolder1_ddlAgentPercEdit">
    <option value="">Select Percentage</option>
    <option value="0.50">0.5</option>
    <option value="0.75">0.75</option>
    <option value="0.9">0.01</option>
    <option value="0.7">0.7</option>
    <option value="0.1">0.1</option>
    <option value="0.8">0.8</option>
    <option value="0.6">0.6</option>
    <option value="0.9">0.9</option>
    <option value="0.05">0.05</option>
    <option value="0.95">0.95</option>

</select>
                               </div>
                           </div>
                      </div> 
                </div>
            <input type="hidden" name="ctl00$ContentPlaceHolder1$hfLifeID" id="ctl00_ContentPlaceHolder1_hfLifeID" />
            </div>
        </div>
            </div>

【问题讨论】:

  • 你为什么不用&lt;%=ddlAgentPercEdit.ClientID%&gt;
  • 为什么你用ClientID做其他事情而不用ddlAgentPercEdit
  • 我一开始尝试使用 ClientID,但它不是那样工作的。
  • 你的java脚本调试了吗?

标签: javascript jquery asp.net jquery-ui drop-down-menu


【解决方案1】:

你应该使用

$("#<%=ddlAgentPercEdit.ClientID%>").val('0.50');

JSFIDDLE上查看我的示例

请从您的浏览器粘贴您呈现的 html。我会帮你解决的

【讨论】:

  • 它也不能这样工作,我已经尝试过了,但感谢您的提示
  • 包含模式弹出窗口的渲染代码,虽然我不知道它有多大帮助。
【解决方案2】:

我认为这可能是个问题...

您似乎正在设置下拉列表的值,正在显示before the Modal ..

所以理论上讲your dropdown is not yet visible 当您尝试设置值时。

所以尝试在模态显示后设置下拉列表的值..

 $('#editSplitAgent').modal('show');   // Show the modal first 
 $("[id*=ddlAgentPercEdit]").val('0.50');  // Then set the value  

【讨论】:

  • 他绑定事件的方式是正确的,不管是之前绑定还是之后绑定
  • 我没有更正他绑定事件的方式..最初绑定事件时,他正在委派事件..这意味着页面上还没有Modal .. 意义它将在那个时间点被动态添加或设置为“显示:无”。因此,如果您为隐藏的元素设置值,则不会发生任何事情。这就是我要求 OP 设置显示 Modal 后下拉菜单的值
猜你喜欢
  • 2012-06-09
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2010-11-21
  • 2013-10-11
  • 2012-04-18
相关资源
最近更新 更多