Calling Web service twice or more when enter keyword button twice or more

Hello

I want to prevent calling web service twice or more when enter keyword button twice or more

So how to prevent it.

My code like this

function jWDGetTranslation() {

$("#div_ShowMsg").hide();

$("#showMore").hide();

$('#list').empty();
var txtSearchText = $("#<%= txtSearchText.ClientID %>")
var activeDictionaryType = '<%=ActiveDictionaryType %>';
var baseCultureId = '<%=BaseCultureId %>';
var targetCultureId = '<%=TargetCultureId %>';
var pageSize = '<%= GetGlobalResourceObject("mta","pageSize") %>'

if (txtSearchText[0].value != '') {
WebDirekt.WebServices.Translation.GetTranslation(activeDictionaryType, baseCultureId, targetCultureId, txtSearchText[0].value, 1, pageSize, jWdGetTranslationOnSuccess, jWdFail);
}
else {
$('#list').empty();
$("#div_ShowMsg").show();
}
return false;
} // jWDGetTranslation

function jWdGetTranslationOnSuccess(resultData) {
var searchResultWithNextPageNumber = resultData.split('~');
var nextPageNumber = searchResultWithNextPageNumber[1];
var searchResultData = JSON.parse(searchResultWithNextPageNumber[0]);
var recoudCount = searchResultData.length;

/* Loop on searchResultData and append to list ul */
if (recoudCount > 0) {
for (var i = 0; i < recoudCount; i++) {
$('#list').append('<li> ' + searchResultData[i].Item + ' </li>');
}
$('#list').listview('refresh');
}
// IF not searchResultData then show data not found message
else {
$("#div_ShowMsg").show();
}

/* If next page number is 0 then hide the Show more button */
if (nextPageNumber > 1) {
/*Create the dynamic button and add to div of show more */
var btn = "<a onclick='return jWdShowNextPage("
btn += nextPageNumber;
btn += ");' class='showMore showMore-corner-all showMore-shadow' title=";
btn += '<%= GetLocalResourceObject("btnShowMoreToolTip") %>>';
btn += '<%=GetLocalResourceObject("btnShowMoreText") %>';
btn += "</a>";
$("#showMore").html(btn);
$("#showMore").show();
}
else {
$("#showMore").hide();
}
} // jWdGetTranslationOnSuccess

function jWdFail(resultError) {
alert(resultError);
}

function jWdShowNextPage(nextPageNumber) {
$("#div_ShowMsg").hide();
var txtSearchText = $("#<%= txtSearchText.ClientID %>")
var activeDictionaryType = '<%=ActiveDictionaryType %>';
var baseCultureId = '<%=BaseCultureId %>';
var targetCultureId = '<%=TargetCultureId %>';
var pageSize = '<%= GetGlobalResourceObject("mta","pageSize") %>'

// Call the web service
WebDirekt.WebServices.Translation.GetTranslation(activeDictionaryType, baseCultureId, targetCultureId, txtSearchText[0].value, nextPageNumber, pageSize, jWdGetTranslationOnSuccess, jWdFail);
return false;
} //jWdShowNextPage

<asp:TextBox ID="txtSearchText" runat="server" onblur="trim(this);" MaxLength="256"></asp:TextBox>

<asp:LinkButton ID="lnkBtnSearch" runat="server" data-transition="slide" data-theme="a" meta:resourcekey="lnkBtnSearch" data-icon="arrow-r" data-role="button" data-iconpos="right" OnClientClick="return jWDGetTranslation();" CssClass="lnkBtnCss" />

When i enter the text and enter keyboard button twice or more then it call web service twice or more

so how i prevent the calling web service multiple time when i enter the my default search button

Re: Calling Web service twice or more when enter keyword button twice or more

Hi a.hole,

So based on your description, I understand that you use JQuery to build a webform which allow user to search some data by clicking a button. And in the button_click script event, you will invoke a function which makes AJAX call (against a webservice method) to retrieve search result. And you want to prevent the AJAX search function call be invoked multiple times in case user click the button multiple times,correct?

If so, I think the most straightforward and reliable means is to add some flag which marks if the search function has been invoked annd not finished yet. And in your script click event function, you will check this flag variable to determine if you will execute the AJAX call or not. For example:

var is_search_in_progress = false;

$('btnSearch').click(function(){ if(is_search_in_progress == true) return;

is_search_in_progress = true;

// make the ajax call here

});

and don't forget the reset the flag after the AJAX function call(your search webmethod call) finishes. And you should use the "complete" event so that it will be called no matter the call succeed or failed.

BTW, the above example use a global script variable to hold the flag, you can also use the JQuery data API to store the flag in the associated data bag of the search button element.

#.data()
http://api.jquery.com/data/