2

我想创建一个类似于www.redfin.com在其搜索页面上的功能。当用户在文本框中单击时，将打开一个搜索表单。

我正在使用 MVC 和 jQuery，但不知道如何去做。我尝试使用 Dialog 插件，但由于某种原因，对话框只打开一次。

<input id="txtSearch" type="text" />
<div id="searchForm" title="Dialog Title">I am a dialog</div>

$("#txtSearch").click(function() {
    // Show form
    $("#searchForm").dialog();
});

但是，在常规网站中，对话框甚至不会打开。

$("#txtSearch").click(function() {
        // Show form
        $("#searchForm").dialog();
    });

使用焦点或单击似乎具有相同的效果。该对话框仅打开一次。当我关闭它并再次单击文本框时，没有对话框。

我是否使用正确的方法来完成这项任务？有样品吗？欢迎提出建议。

对话框可能不是最佳选择，因为它创建了标题。我想知道我还能使用什么，因为我还想通过 ajax 发布表单并在同一页面上显示结果。

谢谢

4

2 回答 2

1

并且您要确保将事件绑定包装在文档就绪脚本中（您可能已经这样做了，但我只是指出它，因为它不在您的示例代码中，以防万一）

$(document).ready(function() {
    $("#txtSearch").click(function() {
        // Show form
        $("#searchForm").dialog();
    });
});

编辑

$("#searchForm").dialog(); 只将对话框注册到我认为的搜索表单

我想你可能需要调用一个对话框 show() 和 hide() 让它出现和消失。我以前使用过jqModal并且不得不这样做

$(document).ready(function() {
    $("#searchForm").jqm({modal: true}); //register this div as a modal

    $("#txtSearch").click(function() {
        // Show form
        $("#searchForm").jqmShow(); //show div
    });
});

稍后，要关闭模式，您调用

$("#searchForm").jqmHide();
于 2009-03-26T21:52:13.287 回答
0

您可能想使用focus事件而不是click事件。

至于该对话框的用途，我建议查看BeautyTips. 查看该页面中的“自定义触发器”示例，这正是您想要做的。

于 2009-03-26T21:48:30.893 回答