0

MVC4 ビューでは、次のようにラジオ ボタンを使用してアイテムのリストを表示しています。

<input type="button" value="Select this address" onclick="setLocation('@Url.RouteUrl("SelectCustomerAddress", new {addressId = item.Id})')" />

ビューのさらに下には、次のように、ユーザーが利用規約に同意する必要があるチェックボックスがあります。

@Html.CheckBoxFor(model => model.TermsAccepted)

ユーザーが続行する前に ToS が受け入れられるように、「onclick」を変更したいと思います。JavaScript を使用する必要がありますか? はいの場合、どのように使用しますか?

では、エラーをどのように表示すればよいでしょうか。ValidationSummary を使用していますか?

編集:

以下の JavaScript を使用すると、onclick は次のように変更されます。

<input type="button" value="Select this address" onclick="selectAddress(@item.Id)" />

そしてJavaScriptを次のように:

           <script>
                $(function () {


                    function selectAddress(selectedId) {
                        if ($('#TermsAccepted').is(':checked')) {
                            setLocation('@Url.RouteUrl("SelectCustomerAddress", new { addressId = selectedId})')
                        }
                        else {
                            $('#checkErrorMsg').toggle();
                        }  
                    }
                })
            </script>
4

1 に答える 1

0

クロムの Inspect 要素を使用すると、の ID を表示できます。ユーザーをナビゲートする前CheckBoxFor(model => model.TermsAccepted)に、関数でそれを確認するだけです。setLocation

これはjavascriptで行われます。私はJqueryを使用しています。だからかみそりのページで私はこれを行います:

<script>
   $(function () {
       // any javascript in here
   })
</script>
@Html.CheckBoxFor(model => model.TermsAccepted)

これにより、ドキュメントが読み込まれるときにすぐに使用できる JavaScript が自動的に読み込まれます。次に、次のようなものを使用して簡単なテストを行います。

if($('#TermsAccepted_Id').is(':checked'))

#TermsAccepted_Idはチェックボックスです。コードが示すように、チェックされているかどうかを確認しているだけです。そうでない場合は、単にエラーを表示します。次のようなエラーを表示できます。

<script>
       $(function () {
           // any javascript in here
           var setLocationFunction = setLocation('@Url.RouteUrl("SelectCustomerAddress", new {addressId = item.Id})');

           function checkTsAndCs() {
              if($('#TermsAccepted_Id').is(':checked'))
              {
                 //Everything okay, proceed
                 setLocationFunction(); // this is where you want to call the function from above, it'd be better to make it a variable for use later, i'm not 100% sure on how to call a function, that would be a quick look up for you ;)
              }
               else
              {
                 $('#checkErrorMsg').toggle();
              }  
           }
       })
</script>
@Html.CheckBoxFor(model => model.TermsAccepted)
<div id="checkErrorMsg" style="display:none">Please accept these before you go on.</div>

あなたの見解では、これを入れてください:

<input type="button" value="Select this address" onclick="checkTsAndCs()" />

javascript:onclick 関数の前に置く必要があるかどうかcheckTsAndCsはわかりませんが、繰り返しますが、それを見つけることができます;)、私は通常、すべての jquery javascript をその瞬間に書き、その後すぐにすべてを忘れます。面白いのはわかっていますが、私の脳はそれを覚える必要はないと考えています。

于 2013-06-11T08:58:29.333 に答える