We Keep Coding

Fullcalendar 3.1.0 js/c# does not display the update dialog after finding an event

After searching for an event successfully, I would like to open the update / delete dialog with all information filled in. But nothing happens.
I have this code in Default.aspx:
<script type="text/javascript">
$(function () {
$("[id$=txtSearch]").autocomplete({
source: function (request, response) {
$.ajax({
url: '<%=ResolveUrl("~/Default.aspx/GetEvent") %>',
data: "{ 'prefix': '" + request.term + "'}",
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8",
success: function (data) {
response($.map(data.d, function (item) {
return {
label: item.split('|')[0],
val: item.split('|')[1]
}
}))
},
error: function (response) {
// alert(response.responseText);
},
failure: function (response) {
alert(response.responseText);
}
});
},
select: function (e, i) {
$("[id$=hfCustomerId]").val(i.item.val);
date = moment(i.item.label, "DD/MM/YYYY HH:mm");
$("#calendar").fullCalendar('gotoDate', date);
let eventProva = $("#calendar").fullCalendar("getEventById", i.item.label);
$("#calendar").fullCalendar('updateEvent', eventProva);
},
minLength: 1
});
});
</script>
where 'i.item.label' is the event id.But nothing happens with the line $("#calendar").fullCalendar('updateEvent', eventProva);

jquery Ajax doesn't show any message(neither success nor failure)

I want to submit a form with jquery Ajax. But it does not show any kind of message. I have followed this question and this question. But I didn't get my solution. My jquery code is:
$(document).ready(function () {
$("#btnSave").submit(function (e) {
e.preventDefault();
var myTableArray = [];
$("table#vouchTable tr").not(':first').each(function () {
var arrayOfThisRow = [];
var tableData = $(this).find('td');
if (tableData.length > 0) {
tableData.each(function () { arrayOfThisRow.push($(this).text()); });
myTableArray.push(arrayOfThisRow);
}
}); ///This Part works fine
///But this part does not work
$.ajax({
url: '/Accounts/VoucherEntry',
type: 'POST',
data: JSON.stringify(myTableArray),
contentType: 'application/json; charset=utf-8',
dataType: 'json',
success: function (msg) {
alert(msg);
},
error: function (xhr, status, error) {
var err = eval("(" + xhr.responseText + ")");
alert(err.Message);
}
});
return false;
////////////////////
});
});

Try this:
Missing end brackets for : $(document).ready(function () {
Missing end brackets for : $("#btnSave").submit(function (e) {
$(document).ready(function () {
$("#btnSave").submit(function (e) {
e.preventDefault();
var myTableArray = [];
$("table#vouchTable tr").not(':first').each(function () {
var arrayOfThisRow = [];
var tableData = $(this).find('td');
if (tableData.length > 0) {
tableData.each(function () { arrayOfThisRow.push($(this).text()); });
myTableArray.push(arrayOfThisRow);
}
});
var data = JSON.stringify(myTableArray);
$.ajax({
url: '/Accounts/VoucherEntry',
type: 'POST',
data: data,
dataType: 'json',
success: function (msg) {
alert(msg);
},
error: function (xhr, status, error) {
var err = eval("(" + xhr.responseText + ")");
alert(err.Message);
}
});
}); // <----- Missing brackets!!!
}); // <----- Missing brackets!!!

Format you data like:
data: {data:myTableArray},
in c# get the data by the key data

How to turn autocomplete into a function

I am calling jquery autocomplete several times on my form. How can I refactor and the following javascript into a function?
$(document).ready(function () {
$("#Style").autocomplete({
source: function (request, response) {
$.ajax({
url: "/Beer/AutoStyle",
type: "GET",
dataType: "json",
data: { term: request.term },
success: function (data) {
response($.map(data, function (item) {
return {
label: item.Style,
value: item.Style
}
}));
}
});
}
});
});
I cannot figure out how to paramterize the this
return {
label: item.Style,
value: item.Style
}
So my function would be something like this
function AutoCompleteTemplate(tagID){
$(document).ready(function () {
$("#"+tagID).autocomplete({
source: function (request, response) {
$.ajax({
url: "/Auto"+tagID,
type: "GET",
dataType: "json",
data: { term: request.term },
success: function (data) {
response($.map(data, function (item) {
return {
label: item.tagID,
value: item.tagID
}
}));
}
});
}
});
});
}

You need to use bracket notation as the member operator, since tagID is a variable holding the actual property key
function AutoCompleteTemplate(tagID) {
$("#" + tagID).autocomplete({
source: function (request, response) {
$.ajax({
url: "/Auto" + tagID,
type: "GET",
dataType: "json",
data: {
term: request.term
},
success: function (data) {
response($.map(data, function (item) {
return {
label: item[tagID],
value: item[tagID]
}
}));
}
});
}
});
}

use call back in jquery ajax to set a selected text selected in drop down

I am populating a country state and city drop down list, but I am able to populate the data in the drop down list but what i want is to also set the selected value of option which I have requested from database, but i am not able to do that, What I have done is to use the call back function. May be it can be done without using the call back. Below is my code.
var state;
function func(state) {
//alert("callback " + state);
$('#state option[value="' + state + '"]').prop('selected', 'selected');
}
$.ajax({
url: 'http://localhost:3000/getcountrylist',
type: 'GET',
success: function (data, textStatus, jqXHR) {
var countryDropDown = $('#country');
var citizenCountryDropDown = $('#citizencoutnry');
//alert("In country list");
$.each(data, function (index, result) {
countryDropDown.append(
$('<option/>', {
value: result.countrycode,
text: result.countryname
}));
citizenCountryDropDown.append(
$('<option/>', {
value: result.countrycode,
text: result.countryname
}));
});
$.ajax({
url: 'http://localhost:3000/editempform?userid=' + split,
type: 'GET',
success: function (data, textStatus, jqXHR) {
$.each(data, function (index, result) {
//$('#country option[value="PK"]').prop('selected', 'selected');
//$('select[name="country"] option[value="PK"]')
$("#country").find("option").filter(function (index) {
return result.country === $(this).text();
}).prop("selected", "selected");
$.ajax({
url: 'http://localhost:3000/getstatelist',
type: 'GET',
data: {
'countrycode': $("#country").val()
},
success: function (data, textStatus, jqXHR, func) {
var stateDropDown = $('#state');
$.each(data, function (index, result) {
stateDropDown.append(
$('<option/>', {
value: result.state,
text: result.state
}));
});
},
error: function (jqXHR, textStatus, errorThrown) {
}
});
state = result.state;
$.ajax({
url: 'http://localhost:3000/getcitylist',
type: 'GET',
data: {
'countrycode': $("#country").val()
},
success: function (data, textStatus, jqXHR) {
var cityDropDown = $('#city');
$.each(data, function (index, result) {
cityDropDown.append(
$('<option/>', {
value: result.cityname,
text: result.cityname
}));
});
},
error: function (jqXHR, textStatus, errorThrown) {
}
});
$("#city").find("option").filter(function (index) {
return result.city === $(this).text();
}).prop("selected", "selected");
});
},
error: function (jqXHR, textStatus, errorThrown) {
}
});
},
error: function (jqXHR, textStatus, errorThrown) {
}
});

Please change your jquery selected dropdown script like below.
$("#<%= lstAssignedTo.ClientID %> option").filter(function () {
return ($(this).text() == result.d[0]['assigned']);
}).attr('selected', 'selected');

jQuery autocomplete not filtering

I have a jQuery autocomplete control that is populating with data but the list just displays when I type anything in the box and doesn't filter my results. Does anyone know how to alter this behavior?
<script type="text/javascript">
$(function () {
$('#datePicker').datepicker();
});
$(document).ready(function() {
$("#autocomplete").autocomplete({
source: function (request, response) {
$.ajax({
url: "FacilitiesAsync",
type: 'GET',
cache: true,
data: 'sourceDb=myDb',
dataType: 'json',
success: function (json) {
response($.map(json, function (name) {
return {
label: name.label,
value: name.value
};
}));
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
$("#autocomplete").text(textStatus + ', ' + errorThrown);
}
});
},
select: function (event, ui) {
$('#autocomplete').val(ui.item.label);
return false;
},
messages: {
noResults: '',
results: function () {
}
}
});
});
</script>