1

HTML に次のようなチェックボックスがあります。

<input type="hidden" name="<TMPL_VAR NAME=SHORT>" value="<TMPL_VAR NAME=ELSE>">
<input type="checkbox" name="<TMPL_VAR NAME=SHORT>" id="checkbox-2" value="<TMPL_VAR NAME=FLAG>" class="checkbox mid-margin-left">
<label for="checkbox-2" class="label"><TMPL_VAR NAME="NAME"></label>

基本的に、ここで達成しようとしているのは、チェックボックスがチェックされている場合は 1 つの値が送信され、チェックボックスがチェックされていない場合は別の値が送信されることです (基本的にデフォルト値)。さて、これは動的なので、「これが定義されている場合はこれを意味し、定義されていない場合は別のことを意味する」というようなことを CGI で行うことはできません。

とにかく、チェックボックスをオフのままにすると、非表示の入力から値が取得されます。ただし、チェックすると両方の値が得られます。ここで、「これに複数の値がある場合、使用する値は 2 番目の値です」と言えます。しかし、複数の値を受け入れる選択リストの値を取得している場合はどうなるでしょうか? そのような状況では、送信されたすべての値が有効であるため、2 番目の値を取るとは言いたくありません。

つまり、私が言おうとしているのは、「チェックボックスで、複数の値がある場合は 2 番目の値を取得し、それ以外の場合は最初の値を取得する」ということです。

これを行う方法についてのアイデアはありますか？多分私はこれを正しくしていませんか？これを達成するためのより良い方法に関する提案はありますか? ブール値 (はい/いいえ) にラジオ ボタンを使用したくありませんが、それが唯一の方法である場合は、そうします。

4

2 に答える 2

2

JS が必要ない場合は、フォームを変更して、名前に接頭辞が付いたすべてのフィールドに代替値があるようにすることをお勧めします。

<form id="myform" method='post' action="/echo/json/">
    <input type="hidden" name= "alternate-foo" value="foo not selected" />
    <input type="hidden" name="alternate-bar" value="first bar" />
    <p>Foo <input type='checkbox' name='foo' id='foo' value='foo selected' /></p>
    <p>
        <select name='bar' id='bar' multiple>
            <option value='first bar'>bar 1</option>
            <option value='second bar'>bar 2</option>
            <option value='third bar'>bar 3</option>
        </select>
    </p>
    <p><input type='submit' name='submit' value='submit' /></p>
</form>

Perl コードでは、次のようなことができます。

use strict;
use warnings;
use CGI;

my $q = CGI->new;

$q->param( 'foo', $q->param('alternate-foo') ) unless $q->param('foo');
$q->param( 'bar', $q->param('alternate-bar') ) unless $q->param('bar');

または、より動的にするには:

use 5.014;
foreach my $alt ( grep { /^alternate-/ } $q->param ) {
  my $name = $alt =~ s/^alternate-//r;
  $q->param( $name, $q->param( $alt )) unless $q->param($name);
}
于 2013-07-28T10:03:12.783 に答える
2

便宜上、JavaScript と jQuery を使用します。唯一の欠点は、クライアントが JS を無効にしている場合は機能しないことです。

あなたのフォームはほとんど同じままである可​​能性があります。簡単な例を作りました。すべてにIDがあることを確認してください。

<form id="myform" method='post' action="/echo/json/">
    <input type="hidden" id="hidden-foo" value="foo not selected" />
    <p>Foo <input type='checkbox' name='foo' id='foo' value='foo selected' /></p>
    <p>
        <select name='bar' id='bar' multiple>
            <option value='first bar'>bar 1</option>
            <option value='second bar'>bar 2</option>
            <option value='third bar'>bar 3</option>
        </select>
    </p>
    <p><input type='submit' name='submit' value='submit' /></p>
</form>

次に、フォームの下またはイベントのイベント ハンドラー内に配置する必要がある JS コードを次に示しますload。

$(document).ready(function() {    
    $("#myform").submit(function(){
        // if checkbox is not checked, change value and check so it's transmitted
        if (! $("#foo").is(":checked")) {
            $("#foo").val($("#hidden-foo").val()).prop('checked', true);
        }

        // take first option if no option is selected
        if( $("#bar option:selected").length == 0 ) {
            $("#bar option:first").attr('selected','selected');
        }
    })
});

それはかなり簡単です：

  • チェックボックスがチェックされていない場合は、値が非表示フィールドの値に変更され、チェックが付けられます。
  • オプションが選択されていない場合は、最初のオプションが選択されます

デモ用のjsFiddleを次に示します。出力を表示するには、Firebug コンソールを開く必要があります。

これで、テンプレート エンジンが JS コードをいじる必要なく、すべてのフォーム フィールドを処理できる動的なものに簡単に変換できるはずです。

于 2013-07-28T09:51:46.057 に答える