2012-01-25 3 views
0

私は、フォームを自動的に送信し、プロジェクト全体を通して部分ビューで使用する検索を実行するドロップダウンリストを持っていますが、それは私がページをリフレッシュしない限りです。 jQuery MobileプロジェクトのMVC 4です。ここでMVC4、jQuery MobileとJavascriptの自動送信は、リフレッシュまで一度しか動作しません

は、私は私の部分図を持っているコードは、私は部分ビューを使用するたびページ/ビューが何らかの形でロードされているページやリストを更新できるようにする必要があると思い、

<script type="text/javascript"> 
    $(function() { 
     $("#CoastLineID").change(function() { 
      var actionUrl = $('#TheForm').attr('action') + '/' + $('#CoastLineID').val(); 
      $('#TheForm').attr('action', actionUrl); 
      $('#TheForm').submit(); 
     }); 
    }); 
</script> 
<p> 
    @using (Html.BeginForm("SearchCoast", "Home", FormMethod.Post, new { id = "TheForm" })) 
    { 
     @Html.DropDownList("CoastLineID", (SelectList)ViewBag.ArticleId, "Select a Coastline") 
    } 
</p> 

です。これはjQueryの問題ですか?

私は許可されている場合、任意のアイデア、私はサイトのURLを置くことができますか?

更新/編集

みんなありがとうは、

私はjQueryのモバイルとMVCとを混合、いくつかの問題に遭遇してきた主に起因する彼ら異なり、両方のハンドルURL文字列は、すべて15から来る道へ何年ものウェブ開発。すべてのjQuery Mobileドキュメントは、たとえばMVCの方法ではない/ us.htmlについての古典的なURL文字列を扱います。

これは、ドロップダウンを移入するために私のコントローラのコードである

var coastlines = db.CoastLines.Select(c => new { c.CoastLineID, c.CoastLineName }); 
ViewBag.CoastLineId = new SelectList(coastlines.AsEnumerable(), "CoastLineID", "CoastLineName", 0); 

そしてこれはウェブサイトで、

http://www.peninsulaguide.com.au/

は「ビーチ検索」をクリックし、「海岸線を選択します」か、 "Select a Town"は動作しますが、それ以降は何も更新されません。

2つのドロップダウンがありますが、削除すると違いはありません。あなたが記述している何

乾杯、

マイク

+0

フォームが呼び出すコントローラにブレークポイントを設定した場合、ヒットしますか?私が知る限り、あなたがそれをブロックする措置を取らない限り、あなたがフォームを再提出するのを妨げるものは何もありません。 jQueryフォームを再作成する前にjQueryフォームを作成しました。これを防ぐためにsubmitの値をクリアしなければなりませんでした。 –

+0

URLは参考になり、私の知る限り許可されています。 –

答えて

0

ページ全体が表示されていないことを確認するのは難しいですが、フォームの投稿時に再読み込みされるページのドロップダウンリストが問題の原因です。

これは、イベントハンドラを1つのドロップダウンリストに接続し、そのイベントハンドラが、同じIDが与えられた後のすべてのドロップダウンリストからの変更イベントを処理することを期待していることです。

jQuery documentation.live()方法をよく読んで、その後、これにコードを変更:

$(function() { 
    $("#CoastLineID").live('change', function() { 
     var actionUrl = $('#TheForm').attr('action') + '/' + $('#CoastLineID').val(); 
     $('#TheForm').attr('action', actionUrl); 
     $('#TheForm').submit(); 
    }); 
}); 

注:あなたはjQueryの1.7以降を使用している場合.live()が廃止されており、交換する必要がありますby .on()。これを達成するためには、詳細はdocumentation for .live()で見つけることができます

$(document).on('change', '#CoastLineID', function() { ... }); 

$("#CoastLineID").live('change', function() { ... }); 

を交換してください。これを指摘してくれたstian.netに感謝します。

+0

jQuery 1.7以降、.live()メソッドは推奨されていません。 .on()を使用してイベントハンドラをアタッチする –

+0

@ stian.net:ポインタありがとう! jQuery 1.7以上をまだ使用していないので気づかなかった。この情報を含めるために投稿を編集しました。 –

+0

皆さんはとても賢いですが、修正しましたが、毎回「ページを読み込む際にエラーが発生しました」というポップアップが表示されますが、動作します。それは私にエラーメッセージを与えていないので、jQuery Mobileをテストすることは非常に難しいです! –

0

は完全に有効と思われます。フォームは、それを防止するための措置を講じない限り、何回でもフォームを再送信することができ、部分的なビューはこれに影響しません。

パーシャルビューは、ページ間でHTMLのスニペットを共有できるようにする単純なASP.NET MVCの仕組みです。ページがブラウザにレンダリングされたら、HTMLとjQueryを処理するだけです。

ほとんどの原因はjQueryのバグです。これは、レンダリングされたばかりのHTMLを見ずに動作するように難しいが、私は2つのいずれかが起こっていることを推測している:

  1. あなたが原因どのようにあなたが選択しているに何度も同じ検索を再送信される可能性があります送信する値。
  2. ドロップダウンメニューの選択が変更されるたびに、イベントが正しく発生しません。限りトラブルシューティングなど

、試してみてください。

  • はそれがすべてで呼び出さなっていますし、どのような検索用語が戻っリクエストで来ているかどうかを確認するために、あなたのコントローラにブレークポイントを設定します。
  • changeコールバック関数内にconsole.log('something')ステートメントを追加して、選択が変更されるたびに呼び出されるようにします。

あなたのサイトへのリンクを投稿する場合は、jQuery側を見ていただきたいと思います。

関連する問題