easyui validatebox textbox 取值和赋值

Posted 2020-10-28 刘奇云

from:https://www.cnblogs.com/mr-wuxiansheng/p/6399274.html
easyui-textbox 

<input id="addSnumber" style="width: 200px; height: 30px;" class="easyui-textbox" type="text" 
　　name="snumber" data-options="required:true, missingMessage:\'请输入学号\'" />
 

 赋值的方式：
 1 //使用表单选择器：代码似乎是有异常的
 2 //$("input[name=\'snumber\']").textbox(\'setValue\', "22012");
 3 //使用表单选择器：代码没有异常 但不能为input设置值
 4 //$("input[name=\'snumber\']").val("22012"); 
 5 //使用id选择器：不能设置值
 6 //$("#addSnumber").val("22012");
 7 //使用id选择器：可以设置值
 8 $("#addSnumber").textbox(\'setValue\', "22012");
 9 //使用id选择器和setText：可以设置值
10 $("#addSnumber").textbox(\'setText\', "22012");

所以：为text-box设置值只能使用id选择器选择表单元素，然后使用textbox("setValue", value); 的方式进行赋值；


获取值也是如此：

var snumber = $("#addSnumber").textbox(\'getValue\');
 



easyui-validatebox的设置值或获取值的方式又有点不一样

表单作如下定义:

<input id="addSnumber" style="width: 200px; height: 30px;" class="easyui-validatebox" type="text" 
　　name="snumber" data-options="required:true, missingMessage:\'请输入学号\'" />
 获取值的方式：
 1 //这种方式是可以设置值的
 2 //$("#addSnumber").val("22015");
 3 //可以设置值
 4 //$("input[name=snumber]").val("22015");
 5 //不能设置值，且语法不对有异常
 6 //$("input[name=snumber]").textbox("setValue", "22015");
 7 //不能设置值，且语法不对有异常
 8 //$("input[name=snumber]").textbox("setText", "22015");
 9 //不能设置值，且语法不对有异常
10 //$("#addSnumber").textbox("setvalue", "22015");
 
所以：validatebox只能用$().val()方式设置和获取值，选择器既可以用id选择器，也可以用表单选择器

 

总结：表单元素使用easyui时，textbox和validatebox设置值和获取值的方式不一样

text-box设置值只能使用id选择器选择表单元素，只能使用textbox("setValue", value) 或 textbox("seText", value) 的方式设置值，使用textbox("getValue") 或textbox("getText") 获取值；

validatebox设置值可以使用id选择器和表单选择器，只能使用val()获取值和设置值。





项目实例：
1.html文件

　　　　　　　　　　　　<tr id="client_check1">
                        <th>委托人证件类型:</th>
                        <td><input id="certType" type="radio" name="certType"
                            class="easyui-validatebox" checked="checked" value="身份证"><label>身份证</label></input>
                            <input id="certType" type="radio" name="certType"
                            class="easyui-validatebox" value="护照"><label>护照</label></input>
                        </td>
                    </tr>
                    <tr id="client_check2">
                        <th>委托人名称:</th>
                        <td><input id="clientName" type="text" name="clientName" style="width:400px;"
                            class="easyui-textbox" data-options="required:true"></input></td>
                    </tr>
                    <tr id="client_check3">
                        <th>委托人手机号码:</th>
                        <td><input id="clientPhone" type="text" name="clientPhone" style="width:400px;"
                            class="easyui-textbox" data-options="required:true"></input></td>
                    </tr>

 

2.js方法

function clientForm(){
    var clientNo = $(\'#client\').val();
    
    //发送ajax请求,如果已存在该委托人的信息,进行回显
    $.ajax({
        type : "GET",
        url : parent.baseUrl+\'goods/findClient/\'+clientNo,
        data : null,
        dataType : \'json\',
        success : function(data) {
            //将委托人的信息进行赋值
            if (data.certType == "身份证") {
                $("input[name=\'certType\'][value=\'身份证\']").attr("checked",true); 
            }else if(data.certType == "护照"){
                $("input[name=\'certType\'][value=\'护照\']").attr("checked",true); 
            }
            
//            $("input[name=\'radioName\'][value=2]").attr("checked",true); 
//            $(\'#certType\').textbox(\'setValue\',data.certType);
            $(\'#clientName\').textbox(\'setValue\',data.name);
            $(\'#clientPhone\').textbox(\'setValue\',data.mobile);
        }
    });
}