1

我有一个动态表单的网页。它允许用户为设备指定任意数量的属性。这些属性可以是选择选项列表。当用户选择它时，他们会看到一个按钮来添加选项。

我的问题是我需要知道每个属性有多少个选项。我曾尝试过数var counter=$('.class-name').next().val();数alert(counter);，看看它是否有效。但我得到的只是未定义的警报，因此没有初始化 var 计数器。

我需要知道每个选择列表的选项数量，以便能够将它们组合在一起并知道哪些选项与特定属性相关。我想不出通过 JS 或 PHP 来做到这一点的方法。我可以获得发布在 php 中的选项，但我无法确定每个属性都有哪些选项。

这是一个小提琴！

4

1 回答 1

0

这是获取每个相应选项的长度的代码。

$('.tattribute option:selected[value="text"]').length
$('.tattribute option:selected[value="checkbox"]').length
$('.tattribute option:selected[value="select-list"]').length
$('.tattribute option:selected[value="notes"]').length

小提琴

这是一个添加隐藏字段以跟踪选项计数的小提琴。每次添加或删除选项时，隐藏字段的值都会增加或减少。更改在下面的代码中

var template="<div class=\"new-attribute\">"
                 + "<h3>New Attribute</h3>"
                 + "<label for=\"attributeName[]"+"\">Name:</label>"
                 + "<input class=\"attribute\" type=\"text\" name=\"attributeName[]"+"\">"
                 + "<input class=\"attribute_count\" type=\"hidden\" name=\"attributeCount[]"+"\">"
                 + "<label for=\"attributeType[]"+"\">Type:</label>"
                 + "<select class=\"tattribute\" name=\"attributeType[]"+"\">"
                 + "<option value=\"text\" selected>Text</option>"
                 + "<option value=\"checkbox\">Checkbox</option>"
                 + "<option value=\"select-list\">Select Option List</option>"
                 + "<option value=\"notes\">Notes</option>"
                 + "</select>"
                 + "<div class=\"option\"></div>"
                 + "<button type=\"button\" class=\"remove\">Delete</button>"
                 + "</div>";

和

//Add action
    $("#attributes").on('click', '.btn', function () {
        add = "<div class=\"op\"><label for=\"attributeOption[]" +"\">Name:</label>" 
        + "<input class=\"option-input\" type=\"text\" name=\"attributeOption[]" + "\">"
        +"<button type=\"button\" class=\"remove-option\">remove</button></div>";
        $(this).after(add); 
        //COUNT NUMBER OF OPTIONS
        $opt = $(this).closest('.option')
        $opt.siblings('.attribute_count').val($opt.find('.op').length)
        alert($opt.siblings('.attribute_count').val());
    });

    //Remove input
    $("#attributes").on('click', '.remove-option', function () {
            $(this).closest('.op').remove();
            $opt = $(this).closest('.option')
            $opt.siblings('attribute_count').val($opt.find('.op').length)
    });
于 2013-09-03T12:59:03.837 回答