Question

我正在尝试为我的MVC应用程序构建一个可重用的Product Finder控件。将打开一个模态窗口，客户端可以输入一些文本，点击搜索，然后返回产品并显示在搜索文本框下方（通过ajax调用）。

我遇到的问题是，我需要将客户选择的产品详细信息返回到打开模态窗口的页面。根据我对MVC的了解，我打电话给产品控制器，将所选产品作为模型传递，然后调用相关视图（ShowProducts）。这是有效的，但是你可以想象，搜索的部分视图很难与某个控制器通信，并且也返回到同一个视图。

使用MVC，我想客户端可以添加＆＃34;回调＆＃34;查看传入搜索屏幕的模型，然后可以向控制器传递，然后控制器将使用该值返回正确的视图。这样的问题似乎有点奇怪，所以问题的下一部分是，是否有更容易/更明智的方法。

使用客户端编程是否可以做这样的事情：

在打开模态窗口之前，调用者页面注册了一个事件，搜索控件引发事件，传递产品详细信息调用者页面接收数据（我假设它将收到一个包含产品详细信息的表）并以某种方式将其添加到列表中。

我很欣赏这是非常模糊的，但我试图理解这样的事情是否真的可行（我看过简单的例子，文本框可能会以这种方式改变，但不能通过，基本上是完整的模型在客户端）

任何帮助/指导都将不胜感激。

Answer 1

有点脏，但是一个例子： jsFiddle

HTML：

<div id="list_result">
    LIST OUTPUT:
    <ul id='selection_list'></ul>
</div>
<button id="modal_button">OPEN MODAL DIALOG</button>
<div id="modal_dialog">
    <ul id="product_list">
        <li><input name="product_details_selection" type="checkbox"/>Product 1 Details</li>
        <li><input name="product_details_selection" type="checkbox"/>Product 2 Details</li>
        <li><input name="product_details_selection" type="checkbox"/>Product 3 Details</li>
        <li><input name="product_details_selection" type="checkbox"/>Product 4 Details</li>
        <li><input name="product_details_selection" type="checkbox"/>Product 5 Details</li>
    </ul>
</div>

JS：

$("#modal_button").button().click(function(){
   $("#modal_dialog").dialog({
       autoOpen: true,
      modal: true,
      buttons: {
        Ok: function() {
          $( this ).dialog( "close" );
            $("#selection_list li").remove();
            $("#product_list li input[name='product_details_selection']:checked").each(function(){
                $("#selection_list").append("<li>"+$(this).parent().text()+"</li>");
                console.log("test");
            });
        }
      }
   });
});

通用搜索控件

1 个答案: