0

1 つのページにフォームがあり、フォーム データの一部は mysql データベースのさまざまなテーブルから取得されます。テーブルにはさまざまな選択のオプションが保持されているため、php スクリプトを実行した後のデータは次のようになります。

 <select name="vehicleStyle">
    <option value="empty" selected="selected">- select -</option>
    <option value="coupe">Coupe</option>
    etc....
  </select>

iframe でこのページを読み込む 2 番目のフォームがあります。この 2 番目のフォームを使用すると、この mysql テーブルに含まれるデータを更新して、その場でフォームにオプションを追加できます。すべてがうまく機能しますが、このテーブルをその場で更新 (値を追加) すると、新しいデータがメイン ページの最初のフォームに表示されるようにページを更新する必要があります。ページの自動更新で遊んだことがありますが、それはちょっと不快です。

このフォーム データを jquery 経由で元のページに直接追加する方法はありますか?

ツイートを追加すると、Twitterはこのようなことをすると思いますが(私はTwitterを使用していません)、実際にページ全体をリロードせずに、最近のツイートをページの上部に追加します。

本当にありがとう!

4

3 に答える 3

1

JSを使ってDOM操作をしたいと思います。次のように、ユーザー入力値を含む新しい OPTION タグを SELECT に追加するだけです。

var option = $('<OPTION/>');
$(option).html('INSERT YOUR VALUE HERE');
$('SELECT').append(option);

覚えておいてください: これは、クライアント側だけに OPTION を追加することです。そのため、(iframe 内の) 実際のフォーム送信がデータベースへのデータのプッシュに失敗した場合、これはユーザーにとって一貫性のないビューを表します (新しい OPTION が作成されたと思われるが、実際には失敗した)。

そのため、UI の更新をバックエンドの応答と結び付ける必要があります。通常、バックエンドを更新する呼び出しの AJAX 応答でこの UI を更新します。

于 2010-09-23T17:04:47.627 に答える
1

最良の方法は、load jQuery 関数 ( http://api.jquery.com/load/ ) を使用することだと思います。JavaScript から直接 URL からページをロードできます。

これが私がすることです:

  • 選択の作成を新しい URL に移動します (たとえば、fillselect.php)。
  • 選択を作成せずにページをロードします。代わりに div タグを作成します (例として divforselect という名前を付けます)。
  • ページの onload javascript イベントで、次のように記述します。 $("#divforselect").load("fillselect.php")これにより、div タグの innerText が fillselect.php ページのコンテンツに設定されます。そのため、fillselect.php という URL は完全な html ページではなく、select タグのみが含まれます。

その後$("#divforselect").load("fillselect.php")、選択を更新したいときはいつでも呼び出すことができます!

于 2010-09-23T17:18:58.837 に答える
0

たぶん、AJAX を使用してボックスに入力する必要がありますか? その後、必要なときにいつでもデータを更新できます。

jQuery アヤックス

于 2010-09-23T17:06:11.607 に答える