3

我正在使用来自 elclanrs 的理想形式,并且我有一个从数据库中填充的选择。OnChange 我想用数据库中的信息更新输入字段的值。在这种情况下,名字,姓氏。我用 AJAX 尝试过,但没有成功,因为当表单值更新时,表单的整个理想形式构成消失了。

我查看了stackoverflow,发现这是一个相当普遍的问题,但我似乎仍然无法解决。我用了这个,它不起作用,也许是因为我把它放在了错误的顺序?

这是我的代码:

    <form id="my-form" action="EditAccountHandler.php" method="post">

        <?php
        include 'conn/dbConnect.php';

        echo '<div><label>Gebruikers</label><select id="gebruiker" selected="$sUsername" name="selectedUser" onchange="updateInput(this.value)">';

$sqEditUser = mysql_query("SELECT * FROM account a, persoon p WHERE a.idSuper = p.idUser", $con);

        while($row = mysql_fetch_array($sqEditUser))
                {
                     $iIdUser = $row['idUser'];
                     $sFirstname = $row['Voornaam'];
                     $sLastname = $row['Achternaam'];
                     $sUsername = "{$sLastname}, {$sFirstname}";

                     echo "<option value='$iIdUser'>$sUsername</option>";
                }

        echo "</select></div>";
        ?>
        <script>
        function updateInput(<?= json_encode($sFirstname); ?>)
        {
        document.getElementById("naam").value = <?php echo json_encode($sFirstname); ?>;
        }
        </script>
                    <div><label>Voornaam</label><input id="naam" name="naam" type="text"/></div>
                   <div><label>Achternaam</label><input id="anaam" name="anaam" type="text"/></div>
              <div>     
                <button id="reset" type="button">Reset</button>
                <button type="submit">Wijzigen</button>
              </div>
            </form>

这就是我想要实现的目标: 示例图片

我不确定我做错了什么。你们能帮帮我吗?

编辑
删除了与第一个代码片段相比翻倍的代码。
添加了 echo
删除了 action="EditAccountHandler.php"
添加了 Idealforms 验证代码 替换为最终代码

<div id="main">

                <h3>Wijzig Account</h3><br />
                <form id="myselect" action="" method="post">
                <div>
                <label>Gebruikers</label><select id="gebruiker" selected="$sUsername" name="selectedUser" onchange="this.form.submit()">
                <?php
                include 'conn/dbConnect.php';

                $sqUser = mysql_query("SELECT * FROM account a, persoon p WHERE a.idSuper = p.idUser", $con);

                    while($row = mysql_fetch_array($sqUser))
                    {
                         $iIdUser = $row['idUser'];
                         $sFirstname = $row['Voornaam'];
                         $sLastname = $row['Achternaam'];
                         $sUsername = "{$sLastname}, {$sFirstname}";

                         echo "<option value='$iIdUser'>$sUsername</option>";
                    }
                ?>
                </select>
                </div>
                </form>

                <script>
                var options = { onFail: function(){alert('Selecteer een persoon')}};
                var $myform1 = $('#myselect').idealforms(options).data('idealforms');
                $myform1.focusFirst();
                </script>   

                <?php
                    if(!empty($_POST['selectedUser']))
                    {
                        $sqGetUser = mysql_query("SELECT * FROM persoon WHERE idUser = '$_POST[selectedUser]'", $con);      
                        while($row = mysql_fetch_array($sqGetUser))
                        {
                             $sFname = $row['Voornaam'];
                             $sLname = $row['Achternaam'];
                        }
                ?>

                    <form id="my-form" action="EditAccountHandler.php" method="post">
                    <div><label>Voornaam</label><input id="naam" name="naam" value="<?php echo htmlspecialchars($sFname); ?>" type="text"/></div>
                    <div><label>Achternaam</label><input id="anaam" name="anaam" value="<?php echo htmlspecialchars($sLname); ?>" type="text"/></div>
                    <div>
                        <label>Rechten</label>
                        <label><input type="radio" name="rechten" value="Administrator"/>Administrator</label>
                        <label><input type="radio" name="rechten" value="Contentmanager"/>Contentmanager</label>
                        <label><input type="radio" name="rechten" value="Administratie"/>Administratie</label>
                        <label><input type="radio" name="rechten" value="Medewerker"/>Medewerker</label>
                        <label><input type="radio" name="rechten" value="Klant" checked/>Klant</label>
                        <label><input type="radio" name="rechten" value="Gast"/>Gast</label>
                        <label><input type="radio" name="rechten" value="MedeKlant"/>MedeKlant</label>
                    </div>
                    <div>   
                        <button id="reset" type="button">Reset</button>
                        <button type="submit">Wijzigen</button>
                    </div>
                </form>
            </div>
        </div>
<script>

var options = 
{
    onFail: function() 
    {
      alert( 'Vul alle velden correct in.' )
    },
    inputs: 
    {               
        'anaam': 
        {
        filters: 'required name',

        },

        'naam': 
        {
        filters: 'required name',
        },
    }
};

 var $myform = $('#my-form').idealforms(options).data('idealforms');

  $('#reset').click(function(){ $myform.reset().fresh().focusFirst() });
  $myform.focusFirst();
</script>
<?php
}
?>
4

1 回答 1

1

我认为您正在将客户端代码与服务器代码混淆。

触发 onChange 事件后,您必须重新加载页面,例如 onChange="this.form.submit()" 并验证 if(!empty($_POST["selectedUser"])) 然后填写使用您可以通过新 SQL 查询获得的数据形成表单,其中 id = $_POST["selectedUser"]。

在这种情况下,您不需要 updateuser 功能。

如果您使用 AJAX,则需要 updateuser 函数,但您必须摆脱在服务器上执行的 json_encode 方法,而使用 ajax,一切都在客户端部分。很简单:“函数 updateuser(id)”。

您可以使用 jquery 进行 ajax 调用以获取信息,然后填写表单字段。

编辑:

检查您提供的新代码。我看到一个错误,您正在使用 htmlspecialchars 函数,但您没有回应它,;-)。你应该使用“回声......”。

对于表单,如果您在表单标签内,则应使用“this.form.submit()”。如果你使用 jquery,它会是这样的:

<script type="text/javascript">

$("#selectedUser").change(function()
{
    if(this.form.elements['selectedUser'].value!="")
    {
        this.form.submit();
    }
});
</script>
于 2013-03-27T17:59:20.733 回答