0

这是我的 HTML 代码：

<div id="editorRows">
  <div class="editorRow">
     <input type="hidden" value="01c4ed6d-1234-4951-b048-d86208636479" autocomplete="off" name="comds.index">
     Grupa:
     <select id="comds_01c4ed6d-1234-4951-b048-d86208636479__Grupa" name="comds[01c4ed6d-1234-4951-b048-d86208636479].Grupa">
     Produsul:
     <select id="comds_01c4ed6d-1234-4951-b048-d86208636479__Produs" name="comds[01c4ed6d-1234-4951-b048-d86208636479].Produs">
     Cantitate:
     <input id="comds_01c4ed6d-1234-4951-b048-d86208636479__Cantitate" type="text" value="0" name="comds[01c4ed6d-1234-4951-b048-d86208636479].Cantitate" data-val-required="The Cantitate field is required." data-val-number="The field Cantitate must be a number." data-val="true">
      Pret:
      <input id="comds_01c4ed6d-1234-4951-b048-d86208636479__Pret" type="text" value="17.23" size="4" name="comds[01c4ed6d-1234-4951-b048-d86208636479].Pret" data-val-required="The Pret field is required." data-val-number="The field Pret must be a number." data-val="true">
      TVA:
      <input id="comds_01c4ed6d-1234-4951-b048-d86208636479__TVA" type="text" value="0.24" name="comds[01c4ed6d-1234-4951-b048-d86208636479].TVA" data-val-required="The TVA field is required." data-val-number="The field TVA must be a number." data-val="true">
      Total:
      <input id="comds_01c4ed6d-1234-4951-b048-d86208636479__Total" type="text" value="0" name="comds[01c4ed6d-1234-4951-b048-d86208636479].Total" data-val-required="The Total field is required." data-val-number="The field Total must be a number." data-val="true">
      <a class="deleteRow" href="#">Sterge</a>
    </div>

    <div class="editorRow">
        <input type="hidden" value="97b4ac65-73f8-4339-a707-bad53763fb2e" autocomplete="off" name="comds.index">
        Grupa:
        <select id="comds_97b4ac65-73f8-4339-a707-bad53763fb2e__Grupa" name="comds[97b4ac65-73f8-4339-a707-bad53763fb2e].Grupa">
        Produsul:
        <select id="comds_97b4ac65-73f8-4339-a707-bad53763fb2e__Produs" name="comds[97b4ac65-73f8-4339-a707-bad53763fb2e].Produs">
        Cantitate:
        <input id="comds_97b4ac65-73f8-4339-a707-bad53763fb2e__Cantitate" type="text" value="0" name="comds[97b4ac65-73f8-4339-a707-bad53763fb2e].Cantitate">
        Pret:
        <input id="comds_97b4ac65-73f8-4339-a707-bad53763fb2e__Pret" type="text" value="17.23" size="4" name="comds[97b4ac65-73f8-4339-a707-bad53763fb2e].Pret">
        TVA:
        <input id="comds_97b4ac65-73f8-4339-a707-bad53763fb2e__TVA" type="text" value="0.24" name="comds[97b4ac65-73f8-4339-a707-bad53763fb2e].TVA">
        Total:
        <input id="comds_97b4ac65-73f8-4339-a707-bad53763fb2e__Total" type="text" value="0" name="comds[97b4ac65-73f8-4339-a707-bad53763fb2e].Total">
        <a class="deleteRow" href="#">Sterge</a>
      </div>
   <div class="editorRow">.....
</div>

所以，我正在渲染一个局部视图以显示更多项目，并且我有一个创建更多项目的操作。当我更改第一个 DropDownList 中的值以重新填充第二个时，我正在尝试调用 Json 函数。这是我的脚本：更新

             <script type="text/javascript">
            $(document).ready(function () {
            $('name$=.Grupa').change(function () {

                var url = '<%= Url.Content("~/") %>' + "Comenzi/ForProduse";
                var ddlsource = $(this);
                var ddltarget = $(this).siblings('[name$=.Produs]:first');
                $.getJSON(url, { id: $(ddlsource).val() }, function (data) {
                    $(ddltarget).empty();
                    $.each(data, function (index, optionData) {
                        $(ddltarget).append("<option value='" + optionData.Value + "'>" + optionData.Text + "</option>");
                        });

                    });
                });
            });
       </script>

来自控制器的我的 Json Action 没有被调用。为了工作，我必须在脚本中进行哪些更改？谢谢！

4

2 回答 2

1

除非我只是想念它，否则它$('.editRow.Grupa')似乎与您的 html 中的任何内容都不匹配。这表示要找到具有editRowand类的所有元素Grupa。您没有具有 . 类的元素Grupa。

有关选择项目的有效方法，请参阅此选择器列表：

http://api.jquery.com/category/selectors/

如果您将选择器更改为$('.editRow .Grupa')并将一个类添加到您的 Grupa 选择中，则您的选择器关闭，即Grupa.

这就是说，获取类为的元素内的所有元素，editRow并且类为Grupa。您的选择器表示您想要所有同时具有 classeditRow和Grupa.

于 2011-06-17T16:50:13.557 回答
1

不确定这是唯一的问题，但我认为您正在构建的选择器不是您想要制作的。

.editRow.Grupa

将匹配带有类 editRow 和类 .Grupa 的元素

我认为这一行：

var ddlsource = '.editRow.Grupa';

应该只是$(this);
和你的var ddlsource = '.editRow.Grupa';

应该是这样的var target = $(this).siblings('[name$=.Produs]:first');

然后其中任何一个：$(ddltarget) 应该是目标。

像这样的东西：

$(document).ready(function () {
         $('[name$=.Grupa]').change(function () {   //targets things with the name ending in .Grupa

            var url = '<%= Url.Content("~/") %>' + "Comenzi/ForProduse";
            var source =$(this); //this will be which ever one is changed
            var target = $(this).siblings('[name$=.Produs]:first');  //this SHOULD find the first select with a name ending in .Produs that is the sibling (same level in the dom to the changed select)
            $.getJSON(url, { id: source.val() }, function (data) {
                      target.empty();
                      $.each(data, function (index, optionData) {
                      target.append("<option value='" + optionData.Value + "'>" + optionData.Text + "</option>");

                  });

               });
            });
          });

我还没有测试过这个，但这是你需要去做的一般想法。请注意，我使用的选择器效率很低，如果您可以更改生成的代码以使您的选择框具有已知的类，那将是更整洁的代码，并且更有效

于 2011-06-17T17:01:45.783 回答