Question

我有一个由MYSQL数据组成的表，每当我在表中的元素中进行更改时，我的数据库将由ajax更新。这是我的javascript代码，用于以可编辑的行发送数据。

        function saveToDatabase(editableObj,column,id) {    
        $(editableObj).css("background","#FFF url(images/loaderIcon.gif) no-repeat right");
        $("#tabs-1").load(location.href + " #tabs-1");
            $.ajax({
                url: "saveedit.php",
                type: "POST",
                data:'column='+column+'&editval='+editableObj.innerHTML+'&id='+id,
                success: function(data){
                    $(editableObj).css("background","#FDFDFD");
                }
           });              
    }

在上述功能之后，saveedit.php将处理更新数据库及其功能。

然后，这是我在html中的表格，这些表格元素是可编辑的。

        <?php
            $result = FUNCTION_TO_RETRIEVE_DATA_FROM_DB;
            foreach($result as $k=>$v){
        ?>
        <tr>
            <td><?php echo $k+1; ?></td>
            <td contenteditable="true" onBlur="saveToDatabase(this, 'memberID', '<?php echo $result[$k]["memberID"]; ?>')"><?php echo $result[$k]["memberID"]; ?></td>

            <td contenteditable="true" onBlur="saveToDatabase(this, 'surname', '<?php echo $result[$k]["memberID"]; ?>')"><?php echo $result[$k]["surname"]; ?></td>

            <td contenteditable="true" onBlur="saveToDatabase(this, 'forename', '<?php echo $result[$k]["memberID"]; ?>')"><?php echo $result[$k]["forename"]; ?></td>

            <td contenteditable="true" onBlur="saveToDatabase(this, 'address', '<?php echo $result[$k]["memberID"]; ?>')"><?php echo $result[$k]["address"]; ?></td>

            <td contenteditable="true" onBlur="saveToDatabase(this, 'gradeID', '<?php echo $result[$k]["memberID"]; ?>')"><?php echo $result[$k]["gradeID"]; ?></td>                                
        </tr>
        <?php
            }
        ?>

此代码正常运行，但我想问的问题是，如何验证用户输入的数据到此元素中？例如，如果我想检查初始列memberID，不能超过6个字符，或者是否需要它。我想要做的是在使用AJAX发送之前验证输入的数据，但现在但我不知道如何在表元素中进行验证。

Answer 1

在调用saveToDatabase()函数之前，对输入的值进行所需的验证，如：

var newVal = editableObj.innerHTML;
// Your validation on newVal, if validation successful call the saveToDatabase() function
// Otherwise show an error message and do nothing

Answer 2

检查传递参数，只在条件满足时处理ajax。

function saveToDatabase(editableObj,column,id) {   
//If(editableObj.length > 6) // Case of string Check your other condition.
if(editableObj.toString().length > 6) // in case it is not string.
{
alert(Condition fail);
}
else
{
 // Your ajax call -------
}

}

或者：

在调用saveToDatabase函数之前检查传递的数据。

Answer 3

在调用ajax之前，先通过条件验证你的列。

` function saveToDatabase(editableObj,column,id) {  
    $(editableObj).css("background","#FFF url(images/loaderIcon.gif) no-repeat right");
        $("#tabs-1").load(location.href + " #tabs-1");
           if(column == "memberID"){
               if(editableObj.innerHTML.length > 6 ) { 
                      alert("cannot be longer than 6 characters");
                      return false;
                }else{
                      $.ajax({
                        url: "saveedit.php",
                        type: "POST",
                        data:'column='+column+'&editval='+editableObj.innerHTML+'&id='+id,
                        success: function(data){
                        $(editableObj).css("background","#FDFDFD");
                       }
                    }); 
                   }
                 }             
    }`

元素的简单验证。

3 个答案: