【问题标题】:Use jquery validate plugin to : some select box option value must be chosen使用 jquery validate 插件来:必须选择一些选择框选项值
【发布时间】:2012-05-05 11:07:42
【问题描述】:

首先,我有一个必须选择所有选项值的数组,例如

$require=array('volvo','saab');

那么,

我有 x 个选择框,x 是一个小于或等于的数字 期权价值个数

然后我有选择框,例如

<select name ="car" id="0">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

<select name ="car" id="1">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

<select name ="car" id="2">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

在这种情况下,我需要检查:

1) 没有重复的选择值

2)数组中的值必须选择一个且只有一个。

我可以弄清楚选择框中的unqiue值的检查,但是第二个条件呢?

谢谢

Using the above case as an example

id = 0 , value = volvo
id = 1 , value = Mercedes
id = 2 , value = Audi

Not valid

id = 0 , value = saab
id = 1 , value = Audi
id = 2 , value = volvo

valid

【问题讨论】:

  • 你问我是否在 id=0 中选择沃尔沃,那么在 id=1,id=2 中不应选择沃尔沃
  • 你能用例子正确解释你的第二个条件吗?
  • 没问题,我加了一个例子
  • @ThulasiRam,当然,这意味着它不是唯一的,它应该是无效的
  • @user782104 我仍然没有得到你。这三个下拉列表之间是什么关系?

标签: php jquery jquery-validate


【解决方案1】:

第一个建议,请不要为多个 HTML 元素使用相同的名称,它的 html 无效。 如果您只是为了选择器的目的而这样做,请改用类属性。

我继续使用“分而治之”的方法,它的优化不是很好,但它确实有效。

好吧,我尝试将您的解决方案分为两个步骤:

第 1 步:检查唯一性

//val is the array of values from each select box
function checkUnique(val){
    var cnt = val.length;
    for(i = 0; i < cnt; i++){
        for(j = i+1; j < cnt; j++){
            if(val[i] == val[j]){
                return false;
            }
        }
    }
    return true;
}

第 2 步:检查验证所需的值

// array of required values:
var required = ['saab', 'volvo'];
function validate(){
    var val = [];
    $("select[name=car]").each(function(){
        val.push(this.value);
    });
    if(checkUnique(val)){
        var cnt = required.length;
        var cnt2 = val.length;
        for(k = 0; k < cnt; k++){
            var flag = false;
            for(l = 0; l < cnt2; l++){
                if(required[k] == val[l]){
                    flag = true;
                }
            }
            if(flag){
                return true;
            }
        }
    }else{
        return false;
    }
}

我在文档加载和选择框更改事件的所有事件上调用验证函数:

function showMsg(){
    var msg = (validate())?'OK':'NOT OK';
    // added html DIV tag with id="result" to show the status on change events
    $("#result").html(msg);
}
$(document).ready(function(){
    showMsg();
});
$("select[name=car]").change(function () {
        showMsg();
});

您可以在 jsfiddle 上查看完整示例: http://jsfiddle.net/LCxJw/

【讨论】:

  • 我可以将 php 数组“转换”为 jquery 吗?
  • 是的,你可以使用var required = &lt;?php echo json_encode($phpArray); ?&gt;;,你将把它转换成json对象,你可以使用for(x in required){required[x];}循环遍历它
【解决方案2】:

这是 jQuery 方式:

$('select[name=car]').change(function () {
    var id = $(this).attr('id');
    var selected = $(this).val();
    console.log( id + ' ' + selected );
    $('select[name=car] option').each(function () {
        $(this).removeAttr('selected');
    });
    $('#'+id).find('option[value='+selected+']').attr('selected', 'selected');
});

我建议您从第一个选项开始选择,例如:

<option>Select</option>

【讨论】:

  • 谢谢。但我正在寻找 jquery 验证规则一,谢谢你的帮助。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-09-24
相关资源
最近更新 更多