[JavaScript] ExtJS & JQuery - Ajax 사용하기

[JQuery]

URL : http://jquery.com/download/

API : http://api.jquery.com/category/ajax/

Version : 1.9.1

[Code]

- 초간단 Post 예제 이며, Get 은 Query String 으로 넘기시면 됩니다. 또는 type 을 변경해 주세요.

function getSearchMatchAllJquery(){

var host = "localhost";

var port = "9200";

var currentPage = $('#currentPage').val();

var pageSize = $('#pageSize').val();

var pageLinkSize = $('#pageLinkSize').val();

var indices = $('#indices').val();

$.ajax({

type: "POST",

url: "/elasticsearch/data/getSearchMatchAll.do",

data: {

                host:host,

                port:port,

currentPage:currentPage,

pageSize:pageSize,

pageLinkSize:pageLinkSize,

indices:indices

}

}).done(function( result ) {

          $("#matchAllView").html(result );

});

}

[ExtJS]

URL : http://www.sencha.com/products/extjs/download/ 

API : http://docs.sencha.com/extjs/4.2.0/#!/api/Ext.Ajax

Version : 4.2

[Code]

- Post 예제 이며, Get 방식은 아래 method 를 변경하시면 됩니다.

function getSearchMatchAllExtJs() {

    var host = "localhost";

    var port = "9200";

    var currentPage = $('#currentPage').val();

    var pageSize = $('#pageSize').val();

    var pageLinkSize = $('#pageLinkSize').val();

    var indices = $('#indices').val();

    

Ext.Ajax.request({

          url: '/elasticsearch/data/getSearchMatchAll.do',

          method: 'POST',

          success: function(response, opts) {

              var obj = Ext.decode(response.responseText);

  $("#matchAllView").html(obj );

          },

          failure: function(response, opts) {

              $("#matchAllView").html(response.status );

          },

          scope: this,

          params: {

host:host,

port:port,

currentPage:currentPage,

pageSize:pageSize,

pageLinkSize:pageLinkSize,

indices:indices

          }

});

}