Question

我已经为表单输入的序列化创建了自定义函数。当窗体在引导模式内并且复选框和/或单选按钮返回值未定义时，会出现问题。怎么可能？如果它是“标准”形式，即当形式不在模态内时，效果很好。我还检查了是否存在特定的复选框/单选按钮，这一直是真的。对于文本和其他类型字段，值的存在并不重要。他们可以返回一个空字符串，这很好。

HTML：

    <div class="container">
    <!-- Modal -->
    <div class="modal fade" id="myModal1" role="dialog">
    <div class="modal-dialog">

      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Update/Izmena</h4>
        </div>
        <div class="modal-body">

          <div class="container-fluid text-center" style="font-family:Palatino Linotype;">
    <form id="F3">
        <div class="row">
            <div class="form-group col-sm-3">
                <label for="k_ime">Korisničko ime:</label>
                <input type="text" class="form-control" id="k_ime1" maxlength="30" placeholder="Unesi korisničko ime:" name="k_ime1" value="" required>
            </div>

            <div class="form-group col-sm-3">
                <label for="pwd">Šifra:</label>
                <input type="password" class="form-control" id="pwd1" maxlength="30" placeholder="Unesi željenu šifru" name="pwd1" value="" required>
            </div>
            <div class="form-group col-sm-3">
                <label for="ime">Ime:</label>
                <input type="text" class="form-control" id="ime1" maxlength="30" placeholder="Unesi ime:" name="ime1" value="" required>
            </div>
            <div class="form-group col-sm-3">
                <label for="prezime">Prezime:</label>
                <input type="text" class="form-control" id="prezime1" maxlength="30" placeholder="Unesi prezime:" name="prezime1" value="" required>
            </div>
        </div>
        <div class="row">   
            <div class="form-group col-sm-3">
                <label for="email">Email:</label>
                <input type="email" class="form-control" id="email1" maxlength="30" placeholder="Unesi email:" name="email1" value="" required>
            </div>
            <div class="form-group col-sm-3">
                <label for="tel">Telefon:</label>
                <input type="number" class="form-control" id="tel1" maxlength="10" placeholder="Unesi telefon:" name="tel1" value="" required>
            </div>
            <?php 

                    $pathTo_file = "/xampp/htdocs/www/knjigovodstvo/install/config.ini";
                    $myfile = fopen($pathTo_file, "r+") or die("Unable to open file!");
                    $tekst = fread($myfile,filesize($pathTo_file));
                    fclose($myfile);

                    $arr = explode(",",$tekst);

                    $servername = $arr[0];
                    $username = $arr[1];
                    $password = $arr[2];
                    $dbname = $arr[3];

                    $kon = new SimpleDB($servername, $username, $password, $dbname); 
                    $sql="SELECT id,kategorija FROM tel_kategorija"; 
                    $result = $kon->execute($sql);


                    if ($result->num_rows > 0) {
                        // output data of each row
                        echo "<div class='form-group col-sm-3'><label for='sel4'>Kategorija</label><select id='sel1' class='form-control' name='sel1'>";
                        echo "<option value=''>"."</option>";
                        while($row = $result->fetch_assoc()) {
                        echo "<option value='".$row['id']."'>".$row['kategorija']."</option>";
                        }
                    } 
                    echo "</select></div>";

            ?>
            <div class="form-group col-sm-3">
                <label for="jmbg">JMBG:</label>
                <input type="number" class="form-control" id="jmbg1" maxlength="14" placeholder="Unesi jmbg:" name="jmbg1" value="" required>
            </div>
        </div>
        <div class="row form-group">

            <div class="dropdown col-sm-3">
                <button type="button" id="btn2" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                    <span>Moduli</span>
                    <span class="caret" id="caret1"></span>
                </button>
                <ul id="comp" class="dropdown-menu">
                  <li><a class="dropdown-item"><input type="checkbox" class="form-check-input" name="adminmodul" id="adminmodul" value="x"> Admin modul</a></li>
                  <li><a class="dropdown-item"><input type="checkbox" class="form-check-input" name="ksluzba" id="ksluzba" value="x"> Kadrovska služba</a></li>
                  <li><a class="dropdown-item"><input type="checkbox" class="form-check-input" name="esalter" id="esalter" value="x"> E-šalter</a></li>
                  <li><a class="dropdown-item"><input type="checkbox" class="form-check-input" name="evidencijaio" id="evidencijaio" value="x"> Evidencija ulaza/izlaza</a></li>
                  <li><a class="dropdown-item"><input type="checkbox" class="form-check-input" name="mposlovanje" id="mposlovanje" value="x"> Materijalno poslovanje</a></li>
                  <li><a class="dropdown-item"><input type="checkbox" class="form-check-input" name="emagacin" id="emagacin" value="x"> E-magacin</a></li>
                  <li><a class="dropdown-item"><input type="checkbox" class="form-check-input" name="blagajna" id="blagajna" value="x"> Blagajna</a></li>
                  <li><a class="dropdown-item"><input type="checkbox" class="form-check-input" name="mehanizacija" id="mehanizacija" value="x"> Mehanizacija</a></li>
                  <li><a class="dropdown-item"><input type="checkbox" class="form-check-input" name="ekancelarija" id="ekancelarija" value="x"> E-kancelarija</a></li>
                </ul>
            </div>
        </div>
        <button type="button" id="submit" style="margin-top: 10px" name="submit" class="btn btn-default" data-dismiss="modal" onclick="serialization('adminV2.php',this)">Izmeni</button>   
    </form> 
</div>  
        </div>
        <div class="modal-footer">  
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
      </div>
    </div>
</div>

JS： JS函数的第一个参数是pathToFilename + filename.php，第二个是关键字'this'。

function serialization(phpdoc,me){

    var FormId = me.form.id;

    var name = "";
    var val = "";
    var str = phpdoc+"?";
    var i = 0;

    var net = document.getElementById(FormId).querySelectorAll("#"+FormId+" [name]");
    var len = document.getElementById(FormId).length-1;

    while(i<len) {

        /*if(net[i].type=="checkbox" && net[i].checked===true){
            name = net[i].getAttribute("name");
            net[i].value = "x";
            val = net[i].value; 
        }

        if(net[i].type=="checkbox" && net[i].checked===false){
            name = net[i].getAttribute("name");
            net[i].value = "";
            val = net[i].value; 
        }

        if(net[i].type!="checkbox" && net[i].type!="button"){
            name = net[i].getAttribute("name");
            val = net[i].value;
        }*/

        name = net[i].name;
        val = net[i].value;

        i++;
        str += name+"="+val;

        if(i<len){
            str += "&";
        }

    }

    str = encodeURI(str);
    alert(str);
    str1 = str;

    var xhttp = new XMLHttpRequest();

    xhttp.onreadystatechange = function() {

        if((document.getElementById("raport")!=undefined || document.getElementById("raport")!=null) && this.readyState == 4 && this.status == 200){
            document.getElementById("raport").innerHTML = this.responseText;
        }

    };

    xhttp.open("GET", str, false);      
    xhttp.send();
    //alert(str);
}

您还可以看到我已经尝试检查是否已选中按钮，但除此之外，如果这是真的，则返回的值始终为“未定义”。 PS：变量str1是全局变量，在这种情况下不是问题。

编辑：这就是它的样子

编辑2：

    <!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <script>
  function serialization(phpdoc,me){

    var FormId = me.form.id;

    var name = "";
    var val = "";
    var str = phpdoc+"?";
    var i = 0;

    var net = me.form.querySelectorAll("#"+FormId+" [name]");
    var len = net.length;   
    while(i<len) {

        if(net[i].type=="checkbox" && net[i].checked===true){
            name = net[i].name;
            val = net[i].value; 
        }

        if(net[i].type=="checkbox" && net[i].checked===false){
            name = net[i].getAttribute("name");
            net[i].value = "";
            val = net[i].value; 
        }

        if(net[i].type!="checkbox" && net[i].type!="button"){
            name = net[i].getAttribute("name");
            val = net[i].value;
        }

        i++;
        str += name+"="+val;

        if(i<len){
            str += "&";
        }

    }
    alert(str);
    str = encodeURI(str);

    str1 = str;

    var xhttp = new XMLHttpRequest();

    xhttp.onreadystatechange = function() {

        if((document.getElementById("raport")!=undefined || document.getElementById("raport")!=null) && this.readyState == 4 && this.status == 200){
            document.getElementById("raport").innerHTML = this.responseText;
        }

    };

    xhttp.open("GET", str, false);  
    xhttp.send();

}
  </script>
</head>
<body>

<div class="container">
  <h2>Modal Example</h2>
  <!-- Trigger the modal with a button -->
  <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>

  <!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">

      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Modal Header</h4>
        </div>
        <div class="modal-body">
        <form id="iha">
        Text<input type="text" value="" name="ggg1"></br>
        Number<input type="number" value="" name="ggg2"></br>
        blah3<input type="checkbox" value="ttt3" name="ggg3"></br>
        blah4<input type="checkbox" value="ttt4" name="ggg4"></br>
        blah5<input type="checkbox" value="ttt5" name="ggg5"></br>
        <button type="submit" onclick="serialization('izvestaj.php',this)">klik</button>
        </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>

    </div>
  </div>

</div>

</body>
</html>

编辑第3号（JS）：

    function serialization(phpdoc,me){

    var FormId = me.form.id;

    var name = "";
    var val = "";
    var str = phpdoc+"?";
    var i = 0;

    var net = me.form.querySelectorAll("#"+FormId+" [name]");
    var len = net.length;   
    while(i<len) {

        if(net[i].type=="checkbox" && net[i].checked===true){
            name = net[i].name;
            val = net[i].value; 
        }

        if(net[i].type=="checkbox" && net[i].checked===false){
            name = net[i].getAttribute("name");
            net[i].value = "";
            val = net[i].value; 
        }

        if(net[i].type!="checkbox" && net[i].type!="button"){
            name = net[i].getAttribute("name");
            val = net[i].value;
        }

        i++;
        str += name+"="+val;

        if(i<len){
            str += "&";
        }

    }
    alert(str);
    str = encodeURI(str);

    str1 = str;

    var xhttp = new XMLHttpRequest();

    xhttp.onreadystatechange = function() {

        if((document.getElementById("raport")!=undefined || document.getElementById("raport")!=null) && this.readyState == 4 && this.status == 200){
            document.getElementById("raport").innerHTML = this.responseText;
        }

    };

    xhttp.open("GET", str, false);  
    xhttp.send();

}

这个js代码有效。

序列化功能看不到复选框和单选按钮的值

0 个答案: