3

私はelclanrsのidealformsを使用しており、データベースから入力されたselectがあります。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>

これが私が達成しようとしていることです: 例の写真

何が間違っているのかわかりません。みんな助けてくれませんか?

編集
最初のコードスニペットと比較して2倍だった削除されたコード。
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()"などのページをリロードし、(!empty($ _ POST ["selectedUser"]))のフィールドに入力するかどうかを確認する必要があります。新しいSQLクエリで取得できるデータを含むフォーム。id=$_POST["selectedUser"]。

この場合、updateuser関数は必要ありません。

AJAXを使用する場合は、updateuser関数が必要になりますが、サーバーで実行されるjson_encodeメソッドを削除する必要があり、ajaxではすべてがクライアント部分にあります。単純に「functionupdateuser(id)」になります。

jqueryを使用してajax呼び出しを実行し、情報を取得してから、フォームフィールドに入力できます。

編集:

提供する新しいコードを調べます。エラーが1つあります。htmlspecialchars関数を使用していますが、エコーしていません;-)。「echo...」を使用する必要があります。

フォームの場合、フォームラベル内にいる場合は、「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 に答える