发布要使用ajax查看的数据

时间:2016-02-28 12:27:39

标签: python ajax pyramid

我有一个'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发送回视图并对其执行某些操作,但它返回一个带有jsob obect打印的空视图: enter image description here

1 个答案:

答案 0 :(得分:1)

您需要阻止在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属性,因为它们在这种情况下只会造成伤害。