从表单获取输入并在url中使用它进行ajax调用

时间:2016-01-28 18:36:32

标签: javascript jquery ajax

如何异步将新网址放入ajax调用中?我尝试了一些改动,但它们不起作用。目前代码是:

<!-- Input form -->
<form class="navbar-form navbar-left" role="search" id="formversion">
  <div class="form-group">
    <input type="text" id= "version_number" class="form-control" placeholder="Place version number">
  </div>
</form>

我想获取输入值,我的.js文件:     var version_picked = $(“#version_number”)。val();

我想在类似下一个[完整代码]的函数中使用这个version_picked字符串:

var defau;
var version_picked;

$(document).ready(function(){
    $('#formversion').on('submit', function() {
        version_picked = $("#version_number").val(); 
        defau = version_picked;
        console.log("here",defau);
        return false;
    });

    var p1 = $.ajax({
        "url":"https://www.blabla.com/api/6/61fq8sx8?",
        "crossDomain":true,
        "dataType":"jsonp",
    });

    var p2 = $.ajax({
        "url":"https://www.blabla.com/api/" + defau + "/61fq8sx8?",
        "crossDomain":true,
        "dataType":"jsonp",
    });

    Promise.all([p1,p2])
    .then(function(results){
        // console.log(results[1]); //Sat Jan 16 2016 07:12:47 GMT+0000 (UTC)
        var thisversion = results[1].version; //get the version of the second url/column
        var res_today = results[0].results;
        var res_otherdate = results[1].results;
        var date_today = res_today.collection1[0].date;
        var date_other = res_otherdate.collection1[0].date;
        var collection_today = results[0].results.collection2;
        var collection_otherdate = results[1].results.collection2;
        $(".table-group1").append('<tr>'+'<td class=well"></td>'+ 
            '<td class=well">'+ date_today.substr(56,60) +'</td>'+ 
            '<td class=well">' + date_other.substr(56,60) +'</td>' + 
            '<td class=well">'+ "DNS_1" +'</td>' + 
            '<td class=well">'+ "DNS_2" +'</td>' + 
            '<td class=well">'+ "Mail_1" +'</td>'+
            '<td class=well">'+ "Mail_2" +'</td>'+
            '<td class=well">'+ "Web_1" +'</td>' + 
            '<td class=well">'+ "Web_2" +'</td>' + '</tr>');
        for (var i = 1; i < collection_otherdate.length; i++){ 
            $(".table-group1").append('<tr>' + '<td class="well">' + i + '</td>' +'<td class="well">' + collection_today[i].domain.href + '</td>' + '<td class="well" id="domain1">' + 
                collection_otherdate[i].domain.href + '</td>'+ '<td class="well" >' + collection_today[i].dns + '</td>' + '<td class="well">' + 
            collection_otherdate[i].dns + '</td>' + '<td class="well">' +
            collection_today[i].mail + '</td>' + '<td class="well">' + 
            collection_otherdate[i].mail + '</td>' + '<td class="well">' + 
            collection_today[i].web + '</td>' +  '<td class="well">' +
            collection_otherdate[i].web + '</td>' +'</tr>');     
        }
    })
});

1 个答案:

答案 0 :(得分:0)

您正在使用'jsonp'进行ajax调用。 服务器端代码应该跟踪url中的queryString [“callback”]作为函数名称,并将结果包装到该函数的参数中。然后你可以返回该功能。例如:

string result = ....
return queryString["callback"] + "(" + result + ")"