-1

何らかの理由で、フィールドをクリアすると、ドロップダウンの値が''にリセットされますが、オプションの実際のテキストは表示されませんか？なぜ何かアイデアはありますか？

$(':input','#templatesForm')
.not(':submit, :button, :hidden, :reset')
.val('');

編集：

<select size="1" name="status" id="status">
<option value="">- Select -</option>
<?php
echo $statuses;
?>
</select>

編集2：

素敵なフォームなのかjQueryフォーム検証プラグインなのか、リセットボタンをクリックすると次のコードを使用することがわかっているため、この問題の原因はわかりません。

$("#reset").click(function() {
    validator.resetForm();
});

いくつかのドロップダウンがあり、フォームをリセットすると、ドロップダウンも含めてすべてのフォームフィールドの値がリセットされますが、ドロップダウンのテキストはユーザーの最後の変更と同じままです。最初のオプションがデフォルトのオプションになるように選択を更新する方法を知っている人はいますか？

編集3：

私はこれに数日間困惑しているので、誰かからのアイデア。

編集4：

少なくとも1つのアイデアを持っている人がいることを願っています！

編集5：

これが私が話していることを実行するjsフィドルです。ドロップダウンの値を0にリセットしますが、テキストオプションをデフォルトの-Select-に戻しません。

http://jsfiddle.net/EwpXp/

4

2 に答える 2

1

まず、すべての追加スクリプト (検証とテンプレート) のフィドルを取り除きました。

http://jsfiddle.net/Jacek_FH/EwpXp/5/

次に、niceforms select で動作するようにリセット機能にパッチを当てました。

http://jsfiddle.net/Jacek_FH/EwpXp/7/

Niceforms はどのように機能しますか?

アイデアは単純です: 通常の入力フィールド (ラジオ ボタン、チェックボックス、テキストエリアなどを含む) は、少ししかスタイルを設定できないため、それらを非表示にし、それらの外観を同様に機能する、完全にカスタマイズ可能な新しい構造に置き換える必要があります。理論的には、それほど複雑ではないように思えます。しかし、理論から実践までには長い道のりがあります。

select の処理方法

<div class="NFSelect" style="width: 80px; left: 140px; top: 77px; z-index: 999;">
    <img class="NFSelectLeft" src="img/0.png">
    <div class="NFSelectRight">- Select -</div>
    <div class="NFSelectTarget" style="display: none;">
        <ul class="NFSelectOptions">
            <li><a href="javascript:;" class="NFOptionActive">- Select -</a></li>
            <li><a href="javascript:;">Active</a></li>
            <li><a href="javascript:;">Inactive</a></li>
        </ul>
    </div>
</div>
<select id="status" class="NFhidden" name="status" size="1">
    <option selected="selected" value="">- Select -</option>
    <option value="Active">Active</option>
    <option value="Inactive">Inactive</option>
</select>

フォームのリセットがトリガーされると、すべての html 入力がリセットされますが、Niceforms は div で選択を複製します。したがって、値をオプションから Niceforms div にコピーしました (リセット後)。私のコード:

$('#reset').click(function(){
    // reset form
    $(':input','#templatesForm')
    .not(':submit, :button, :hidden, :reset')
    .val('');
    // update select
    $('select').each(function(){
        var option = $('option:selected', this).html();
        var niceselect = $(this).parents('dd').find('.NFSelectRight');
        niceselect.html(option);
        $(this).parents('dd')
            .find('.NFSelectTarget a')
            .removeClass('NFOptionActive')
            .filter(':first').addClass('NFOptionActive');
    });
});

編集

検討した後、別の方法もあります-Niceformsをリロードできます。しかし、それには価格があります - フォームが点滅します

$('#reset').click(function(){
    // reset form
    $(':input','#templatesForm')
    .not(':submit, :button, :hidden, :reset')
    .val('');
    // reload niceforms
    NFDo('stop');
    NFDo('start');
});
于 2011-08-06T01:57:49.697 に答える
1

値をリセットしていますが、選択を変更していないため、明らかに選択自体は変更されません。次のようなものを検討してください。

$notElements = $('input[type="submit"], input[type="hidden"]', '#templatesForm');
$resetable = $('#templatesForm input').not($notElements);
$('input[type="reset"]').click(function() { $resetable.val(""); return false; });
于 2011-08-05T15:11:40.743 に答える