2017-08-15 154 views
1

我有一個按鈕,當我點擊它時,它會從我的數據庫中獲取數據,並根據ID將其顯示在我的文本區域中。如何從jQuery onclick函數的Ajax函數中獲取值?

JQuery的

$('#verifyBtn').on("click", function() { 
    var exeOutput = checkOutput(); 
    $("outputArea").html(exeOutput); 
}); 

function checkOutput(){ 
    var exNo = parseInt($('#selectExercise').val()); 
    dataString = "exNo=" + exNo; 
    $("#result").empty(); 
    getOutput(dataString, true); 
} 

function getOutput(dataStr, flag) { 
    $.ajax({ 
     url: "/FYP/WebExerciseByOutput", 
     data: dataStr, 
     success: function (data) { 
     return data; 
     }, 
     error : function (xhr,textStatus,errorThrown){ 
      console.log("Something is wrong with ajax call."+ xhr); 
     } 
    }); 
} 

通過我的servlet從我的數據庫中獲取。

的Servlet

exercisesModel outputModel = null; 
try { 
    DBConnection db = new DBConnection(); 
    outputModel = db.getExerciseById(request.getParameter("exNo")); 
} catch (Exception e) { 
    // TODO Auto-generated catch block 
    e.printStackTrace(); 
} 
response.getWriter().append(outputModel.getExpOutput()); 

編輯:一旦點擊,我認爲有數據,但我的文字區域不顯示它。

回答

-1

因爲你正在做的異步調用使用return data;你不能返回立即響應,而是你可以通過選擇那麼當成功調用回調函數將結果賦予您的輸出元素:

<script> 
    $('#verifyBtn').on("click", function() { 
     checkOutput("outputArea"); 
    }); 

    function checkOutput(output_selector){ 
     var exNo = parseInt($('#selectExercise').val()); 
     dataString = "exNo=" + exNo; 
     $("#result").empty(); 

     getOutput(dataString, true, output_selector); 
    } 

    function getOutput(dataStr, flag, output_selector) { 
     $.ajax({ 
      url: "/FYP/WebExerciseByOutput", 
      data: dataStr, 
      success: function (data) { 
       $(output_selector).html(data); 
      }, 
      error : function (xhr,textStatus,errorThrown){ 
       console.log("Something is wrong with ajax call."+ xhr); 
      } 
     }); 
    } 
</script> 

注:不使用通過flag參數。

希望這會有所幫助。

+0

標誌能夠刪除?我的textarea不顯示數據... –

+0

不確定你的意思,但因爲你沒有使用它,所以你可以刪除它..你有沒有嘗試過建議的解決方案? –

+0

我試過了,它不工作,試圖理解添加到帖子的鏈接 –

-1

這這裏塊:

function checkOutput(){ 
var exNo = parseInt($('#selectExercise').val()); 
    dataString = "exNo=" + exNo; 
    $("#result").empty(); 
    getOutput(dataString, true); 

    } 

嘗試添加returngetOutput

function checkOutput(){ 
var exNo = parseInt($('#selectExercise').val()); 
    dataString = "exNo=" + exNo; 
    $("#result").empty(); 
    return getOutput(dataString, true); 

    } 
-1

通過我想你指的是調用的結果。你可以在成功處理程序的參數中找到它。

success: function (data) { 
    //This is your result from server. 
    console.log(data); 
    return data; 
} 

看看你的JS控制檯來查看結果。