post 使用 ajax 查看的数据

post data to view using ajax

我有模板'mytemplae.pt':

function do_option_ajax() {

               var address = document.getElementById('url').value;
               $.ajax({
                   type: "POST",
                   url: "url_option",
                   data: JSON.stringify({url: $(address)}),
                   contentType: 'application/json; charset=utf-8',
                   dataType: 'json',
                   error: function () {
                       alert('error')
                   },
                   success: function (data) {
                       alert('Success');
                   }
               })
           }


<form method="post" action="index">
  <input type="url " name="url" id='url' size="100">
    <button id="2" formaction="url_option" onclick="do_option_ajax()">Confirm</button>
</form>

在 .py 文件中:

config.add_route('option', '/url_option')
@view_config(route_name='option', renderer='json', request_method='POST')
def option(request):
    url = request.params['url']
    # do something and create json_result
    return json_result

有了这些我想发回 json_result 到视图并用它做一些事情,但是它 returns 一个打印了 jsob obect 的空视图:

您需要阻止默认表单操作在 Javascript 中触发。在您的 onclick 处理程序被调用的那一刻,标准 HTML 表单提交开始。标准表单提交从服务器接收数据并将其显示为新页面。

要防止这种情况发生,您需要执行类似

的操作
<form id="myform">
  <input type="url " name="url" id='url' size="100">
    <button id="2">Confirm</button>
</form>


$("#myform").on('submit', function (e) {

    var address = document.getElementById('url').value;
    $.ajax({
        type: "POST",
        url: "url_option",
        data: JSON.stringify({url: $(address)}),
        ...
    });
    e.preventDefault();
});

请注意,我正在监听表单提交事件,而不是按钮点击事件,而且我还从表单中删除了 actionmethod 属性,因为它们只会在这种情况下造成伤害。