9

数日前に投稿した質問に基づいて、 SimpleFormControllerAjaxリクエストの処理には不適切であることに気付きました。したがって、アプリケーションを注釈付きコントローラーに移行しています。

java.util.ListSpring MVC 3.0.2を使用してOracleデータベースから、Jackson 1.9.8(ダウンロードページ)を使用してAjax経由でHibernateを使用してを返そうとしていますが、どのテクノロジでもJSONを使用していません。いくつかのチュートリアル/記事を読みましたが、そのような複雑なデータ構造を返し、SpringでJSONを使用してそれらを解析する方法がわかりませんでした。私は最初にJSONのような概念を学ぼうとしています。

基本的に私が試しているのは、国を選択ボックスから選択した場合、その国に対応する州がAjaxを介してデータベースから入力される必要があるということです。java.util.ListAjax応答を返す方法、それを解析してJavaコードで再び使用する方法について正確な考えはありません。私は次のレベルまでしかありません。

JSコード。

function getStates(countryId)
{
    $.ajax({
        datatype:"json",
        type: "POST",
        url: "/wagafashion/ajax/TempAjax.htm",
        data: "countryId=" + countryId,

        success: function(response)
        {
            $('#msg').html(response);
            $('#stateList').val('');
        },
        error: function(e)
        {
            alert('Error: ' + e);
        }
    });
}

onchange国選択ボックスのイベントでAjaxリクエストが行われたときに呼び出されるSpringコントローラークラスのメソッド。

@RequestMapping(method=RequestMethod.POST, value="ajax/TempAjax")
public @ResponseBody List<StateTable> getStateList(@ModelAttribute("tempBean") TempBean tempBean, BindingResult error, Map model, HttpServletRequest request, HttpServletResponse response)
{
    Session session=NewHibernateUtil.getSessionFactory().getCurrentSession();
    session.beginTransaction();
    List<StateTable>list=session.createQuery("from StateTable where country.countryId=:countryId order by stateId").setParameter("countryId", new BigDecimal(request.getParameter("countryId"))).list();

    session.flush();
    session.getTransaction().commit();
    return list;
}

<c:forEach></c:forEach>ELのループを使用してAjax応答によって返される状態のリストを入力する必要がある状態選択ボックス。

<form:select path="cmbState" class="validate[required] text-input tooltip" title="Mandatory select field.">
    <form:option value="">Select</form:option>

    <c:forEach items="${stateList}" var="row">
        <c:choose>
            <c:when test="${row.stateId==param['stateId'] and deselectCombo!=1}">
                <form:option value="${row.stateId}" selected="selected">${row.stateName}</form:option>
            </c:when>
            <c:otherwise>
                <form:option value="${row.stateId}">${row.stateName}</form:option>
            </c:otherwise>
        </c:choose>
    </c:forEach>
</form:select>

<font style="color: red"><form:errors path="stateId"/></font><br/>

私はAjaxのリクエストとレスポンスを成功させることしかできませんでした。インターネット上で見つかったチュートリアルからは、これ以上理解できませんでした。より正確には、前のループのitems属性でAjax応答をどのように使用できますか?<c:forEach><c:forEach>items="${stateList}"

データのリストを返し、それを前のループで使用して状態選択ボックスにデータを入力するには、ヒント/アイデアを教えてください。ここから少し先に進んでください。

NetBeans 6.9.1(Eclipseではない)を使用しています。EclipseのMarvanプロジェクトに関するいくつかのチュートリアルでは、pom.xmlファイルを含めるように構成する必要があると述べられていました<dependencies></dependencies>(Jackson依存関係)。pom.xmlNetBeansの私のプロジェクトのようなものはありません。ここで説明したようなNetBeansのxmlファイルのどこかに設定する必要がありますか?

4

2 に答える 2

13

使用する必要がある戦略は、jQueryからAJAX呼び出しを行い、JSON応答を取得し、それを使用してjavaではなくjQueryから動的にフォームを更新することです。JSPタグについて私が見ることができる唯一の用途は、ページがロードされたときにページをレンダリングすることです。これが私がこれにアプローチする方法です...

  1. POSTの代わりにGETを使用するようにコントローラーを変更します。1つは、ここでPOSTを使用することはRESTでは正しくありません(データを取得するだけで、データを変更することはありません)。ただし、さらに重要なことは、URLをブラウザーに入力してJSON応答を確認するだけで、コントローラーのテストが容易になることです。アノテーションを使用@ResponseBodyし、クラスパスにJacksonを含めると、ここでJSON応答が生成されます(Hibernateの遅延読み込みの問題がない限り)。

  2. コントローラがJSONを返していることを確認したら、jQuery成功ハンドラを更新してドロップダウンに動的に入力します。これは比較的簡単なはずです。ブラウザでこれをテストします。

  3. このフォーム送信を処理する新しいコントローラーを作成します。このコントローラーには、リストを返し、それに注釈を付けるメソッドを含めるだけ@ModelAttribute("stateList")です。<c:forEach>これにより、ロード時にページをレンダリングするためのループでリストを使用できるようになります。同じコントローラーで実際のフォーム送信を処理する別のメソッドがあります。

考慮すべきもう1つのことは、データベースコードを独自のサービスまたはリポジトリに配置することにより、関心の分離を改善することです。MVCアーキテクチャのコントローラーでデータアクセスを行うことは悪い習慣です。ボーナスとして、2つの異なるコントローラーにリストをロードするためにコードを複製する必要はありません。

また、Springの@Transactional宣言型トランザクション処理についても調べてください。そうすれば、トランザクション処理のためのコードを書く必要がなくなります。SessionFactory独自のを書く代わりに、単に注入することもできますHibernateUtils

お役に立てば幸い

編集: RESTでは、対応するCRUDアクションにマップされたHTTPメソッドがあります。

  • POST-作成
  • GET-取得
  • PUT-更新
  • 削除-削除
于 2012-08-14T16:38:36.290 に答える
4

以下のようなjsonではなくajax応答でオプションリストを試す必要があります

<option value="1">Mumbai</option>
<option value="2">Delhi</option>
<option value="3">Kerala</option>
<option value="4">Rajasthan</option>

次に、それを1つ下の選択ボックスに追加する必要があります

function getStates(countryId)
{
    $.ajax({
    datatype:"html",
    type: "POST",
    url: "/wagafashion/ajax/TempAjax.htm",
    data: "countryId=" + countryId,

    success: function(response)
    {
        $('#stateList').html(response);
    },
    error: function(e)
    {
        alert('Error: ' + e);
    }
  });
}

または、以下のようにサーバーサイドでjsonを作成できます

[{"key":1, "value": "Mumbai"}, {"key":2, "value":"Delhi"}....]

とjavascriptコードで

function getStates(countryId)
{
    $.ajax({
    datatype:"html",
    type: "POST",
    url: "/wagafashion/ajax/TempAjax.htm",
    data: "countryId=" + countryId,

    success: function(response)
    {
         if(response !=''){
              jQuery("#stateList").html("");
              jQuery.each(response, function(index,item) {
                jQuery("#stateList").append(jQuery("<option />")
                .attr("value",item.value)
                .text(item.key)); 
            });
         }

    },
    error: function(e)
    {
        alert('Error: ' + e);
    }
  });
}
于 2012-08-18T12:24:18.743 に答える