Develop Reference

Search Results goes up when scrolling down in JavaScript

I have a search box where users can search for products. This drop down shows all of the products. I am trying to Scroll down the list using scroller but when i scroll down it goes up
if ($('#search_product').length) {
//Add Product
$('#search_product')
.autocomplete({
source: function(request, response) {
var price_group = '';
var search_fields = [];
$('.search_fields:checked').each(function(i){
search_fields[i] = $(this).val();
});
if ($('#price_group').length > 0) {
price_group = $('#price_group').val();
}
$.getJSON(
'/products/list',
{
price_group: price_group,
location_id: $('input#location_id').val(),
term: request.term,
not_for_selling: 0,
search_fields: search_fields
},
response
);
},
minLength: 2,
response: function(event, ui) {
if (ui.content.length == 1) {
ui.item = ui.content[0];
if ((ui.item.enable_stock == 1 && ui.item.qty_available > 0) ||
(ui.item.enable_stock == 0)) {
$(this)
.data('ui-autocomplete')
._trigger('select', 'autocompleteselect', ui);
$(this).autocomplete('close');
}
} else if (ui.content.length == 0) {
toastr.error(LANG.no_products_found);
$('input#search_product').select();
}
},
focus: function(event, ui) {
if (ui.item.qty_available <= 0) {
return false;
}
},
select: function(event, ui) {
var searched_term = $(this).val();
var is_overselling_allowed = false;
if($('input#is_overselling_allowed').length) {
is_overselling_allowed = true;
}
if (ui.item.enable_stock != 1 || ui.item.qty_available > 0 || is_overselling_allowed) {
$(this).val(null);
//Pre select lot number only if the searched term is same as the lot number
var purchase_line_id = ui.item.purchase_line_id && searched_term == ui.item.lot_number ? ui.item.purchase_line_id : null;
pos_product_row(ui.item.variation_id, purchase_line_id);
} else {
alert(LANG.out_of_stock);
}
},
})
.autocomplete('instance')._renderItem = function(ul, item) {
var is_overselling_allowed = false;
if($('input#is_overselling_allowed').length) {
is_overselling_allowed = true;
}
if (item.enable_stock == 1 && item.qty_available <= 0 && !is_overselling_allowed) {
var string = '<li class="ui-state-disabled">' + item.name;
if (item.type == 'variable') {
string += '-' + item.variation;
}
var selling_price = item.selling_price;
if (item.variation_group_price) {
selling_price = item.variation_group_price;
}
string +=
' (' +
item.sub_sku +
')' +
'<br> Price: ' +
selling_price +
' (Out of stock) </li>';
return $(string).appendTo(ul);
} else {
var string = '<div class="col-md-10">' + item.name;
if (item.type == 'variable') {
string += '-' + item.variation;
}
var selling_price = item.selling_price;
if (item.variation_group_price) {
selling_price = item.variation_group_price;
}
string += ' (' + item.sub_sku + ')' + '<br> Price: ' + selling_price;
if (item.enable_stock == 1) {
var qty_available = __currency_trans_from_en(item.qty_available, false, false, __currency_precision, true);
string += ' - ' + qty_available + item.unit;
}
string += '</div>';
string += '<div class="col-md-2" style="text-align:right"> <img src="' + item.image_url + '" width="100" hight="100"> </div>';
return $('<li>')
.append(string)
.appendTo(ul);
}
};
}
Am not sure where am going wrong. Any help is appreciated. when i try to scroll down it allows scrolling but it goes to top instantly top first few results
Thanks in advance.
Laravel Blade Code
{!! Form::text('search_product', null, ['class' => 'form-control mousetrap', 'id' => 'search_product', 'placeholder' => __('lang_v1.search_product_placeholder'),
'disabled' => is_null($default_location)? true : false,
'autofocus' => is_null($default_location)? false : true,
]); !!}

How to correctly send data via ajax to telegram via php?

I made a questionnaire for the site on JS. JS works well, but it doesn't work correctly to send data via ajax to telegram. When sending, it hits error 400. If you set all the variables "hard" and not with a post like $the =question 6:; then everything is normal. It turns out I'm transmitting the data incorrectly. Tell me how to do it correctly.
Js works out as expected before sending it. Everything on the POST goes out(although it writes that everything was sent successfully)
function compileForm() {
// take answers
var answerInput1 = $('.qwestion-1:checked'),
answerInput2 = $('.qwestion-2:checked'),
answerInput3 = $('.qwestion-3:checked'),
answerInput4 = $('.qwestion-4:checked'),
answerInput5 = $('.qwestion-5:checked');
answerInput3Custom = $('#qwestion-3-custom');
scoreSum = answerInput1.data('cost') + answerInput2.data('cost') + answerInput3.data('cost') + answerInput4.data('cost') + answerInput5.data('cost');
var answer1 = answerInput1.val(),
answer2 = answerInput2.val(),
answer3 = answerInput3.val(),
answer4 = answerInput4.val(),
answer5 = answerInput5.val();
if (answerInput3.hasClass('qwestion-3-custom-choose')) {
console.log('another');
answer3 += ' - ' + answerInput3Custom.val();
}
// put unswers to inputs
var sendInp1 = $('#answer-1').val(answer1),
sendInp2 = $('#answer-2').val(answer2),
sendInp3 = $('#answer-3').val(answer3),
sendInp4 = $('#answer-4').val(answer4),
sendInp5 = $('#answer-5').val(answer5);
sendInp6 = $('#answer-6').val(scoreSum);
};
$('#final-qwestion__btn').click(function(e) {
e.preventDefault();
var answers = [];
$('.qwestion').each(function(index, el) {
var number = index + 1;
if (index > 4) {
answers.push(number + ') Номер телефона —— ' + $(this).find('#qwestion__tel-input').val() + '')
answers.push(number + ') Город : —— ' + $(this).find('#qwestion__gorod-input').val() + '')
} else if (index == 2) {
if ($(this).find('input:checked').hasClass('other')) {
answers.push(number + ') ' + $(this).find('.qwestion__heading').text() + ' —— ' + $(this).find('#qwestion-3-custom').val() + '')
} else {
answers.push(number + ') ' + $(this).find('.qwestion__heading').text() + ' —— ' + $(this).find('input:checked').val() + '')
}
} else {
answers.push(number + ') ' + $(this).find('.qwestion__heading').text() + ' —— ' + $(this).find('input:checked').val() + '')
}
});
if (!$('#qwestion__tel-input').val()) {
$('#qwestion__tel-input').css('box-shadow', '0 0 20px 0px #990033');
} else {
$('#qwestion__tel-input').css('box-shadow', 'none');
answers = answers.join('\n')
console.log(answers);
$.ajax({
url: 'send/send.php',
type: 'POST',
data: {
postData: answers
},
success: function(resultData){
alert("Save Complete");
}
})
}
});
});
<?php
if (isset($_POST['qwestion-1'])) {
$qwestionq = strip_tags($_POST['qwestion-1']);
$qwestionqFieldset = "<b>qwestion1:</b> ";
}
if (isset($_POST['qwestion-3'])) {
$qwestiona = strip_tags($_POST['qwestion-3']);
$qwestionaFieldset = "<b>qwestion2:</b>";
}
if (isset($_POST['qwestion-4'])) {
$qwestioz = strip_tags($_POST['qwestion-4']);
$qwestionzFieldset = "<b>qwestion3:</b> ";
}
if (isset($_POST['qwestion-5'])) {
$qwestionw = strip_tags($_POST['qwestion-5']);
$qwestionwFieldset = "<b>qwestion4:</b> ";
}
if (isset($_POST['qwestion-6'])) {
$qwestions = strip_tags($_POST['qwestion-6']);
$qwestionsFieldset = "<b>qwestion5:</b> ";
}
if (isset($_POST['gorod'])) {
$gorod = strip_tags($_POST['gorod']);
$gorodFieldset = "<b>qwestion6:</b> ";
}
if (isset($_POST['tel2'])) {
$tel = strip_tags($_POST['tel2']);
$telFieldset = "<b>qwestion7:</b> ";
}
$token = "";
$chat_id_scr = "";
$txt = rawurlencode($txt);
$arr = array(
$qwestionqFieldset => $qwestionq,
$qwestionaFieldset => $qwestiona,
$qwestionzFieldset => $qwestionz,
$qwestionwFieldset => $qwestionw,
$qwestionwFieldset => $qwestions,
$gorodFieldset => $gorod,
$telFieldset => $tel,
);
foreach($arr as $key => $value) {
$txt .= "<b>".$key."</b>".$value."%0A";
};
$sendToTelegram = fopen("https://api.telegram.org/bot{$token}/sendMessage?chat_id={$chat_id_scr}&parse_mode=html&text={$txt}","r");

Javascript confirm box not working properly when calling in code behind using asp.net c#

i have a button, When i clicked on this button some code written for checking and then confirm box should be open after clicked OK then some other code should work else if clicked cancel i want to exit no further action required, so problem is my confirm box show after all code executed but i want in middle of the processing.
sorry for my english.
function CheckData() {
debugger
// var hdnConfirm = document.getElementById("hdnConfirm");
// hdnConfirm.Value = confirm('Data already exists for current month. Do you want to replace?');
var sResult = confirm('Data already exists for current month. Do you want to replace?');
document.getElementById("<%=hdnConfirm.ClientID %>").value = sResult;
}
if (ddlYear.SelectedIndex > 0 && ddlMonth.SelectedIndex > 0)
{
string sTableName = string.Empty;
//transaction for web
oSqlConnectionWeb = new SqlConnection(GetConnection());
oSqlConnectionWeb.Open();
oSqlTransactionWeb = oSqlConnectionWeb.BeginTransaction();
sConnection = GetConnection();
dtData = new DataTable();
dtData = Con.GetDataTable("select * from ReimSlip_t where year+month = '" + ddlYear.SelectedValue + ddlMonth.SelectedValue + "'");
if (dtData.Rows.Count > 0)
{
sTableName = "ReimSlip_t";
}
else
{
dtData = new DataTable();
dtData = Con.GetDataTable("select * from yr_ReimSlip_t where year+month = '" + ddlYear.SelectedValue + ddlMonth.SelectedValue + "'");
if (dtData.Rows.Count > 0)
{
sTableName = "yr_ReimSlip_t";
}
}
dtLocal = Con.GetDataTable("select * from " + sTableName + " where year+month = '" + oModule.CurrentYearReim + oModule.CurrentMonthReim + "'");
if (dtLocal.Rows.Count > 0)
{
AlterTable("ReimSlip_t", sConnection, "WEB");
// Con.Execute("Delete from " + sTableName + " where year+month = '" + oModule.CurrentYearReim + oModule.CurrentMonthReim + "' ");
iCount = Con.GetCount("select count(*) from ReimSlip_t where year+month = '" + ddlYear.SelectedValue + ddlMonth.SelectedValue + "'", oSqlConnectionWeb, oSqlTransactionWeb);
// if (iCount > 0)
// {
if (ddlYear.SelectedValue == oModule.CurrentYearReim && ddlMonth.SelectedValue == oModule.CurrentMonthReim)
{//yes or no
ScriptManager.RegisterClientScriptBlock(UpdatePanel1, UpdatePanel1.GetType(), "confirm", "CheckData();", true);
//ScriptManager.RegisterStartupScript(Page, Page.GetType(), "myModal", "$('#myModal').modal();", true);
}
else
{
ScriptManager.RegisterStartupScript(UpdatePanel1, UpdatePanel1.GetType(), "alert", "alert('Data already exists for current month. You are not authorised to changed the data.');", true);
}
// }
dtWeb = new DataTable();
dtWeb = Con.GetDataTable("select column_name From information_schema.columns where table_name = 'ReimSlip_t'", oSqlConnectionWeb, oSqlTransactionWeb);
iCount = dataTransfer(dtLocal, dtWeb, sTableName, oSqlConnectionWeb, oSqlTransactionWeb);
if (iCount == 1)
{
iCount = Con.GetCount("select count(*) from " + sTableName + " where year+month = '" + oModule.CurrentYearReim + oModule.CurrentMonthReim + "'", oSqlConnectionWeb, oSqlTransactionWeb);
if (iCount == dtLocal.Rows.Count)
{
ScriptManager.RegisterStartupScript(UpdatePanel1, UpdatePanel1.GetType(), "alert", "alert('Data uploaded successfully.');", true);
}
else
{
ScriptManager.RegisterStartupScript(UpdatePanel1, UpdatePanel1.GetType(), "alert", "alert('Data not uploaded. Try again.');", true);
}
}
else if (iCount != 1)
{
ScriptManager.RegisterStartupScript(UpdatePanel1, UpdatePanel1.GetType(), "alert", "alert('Data not uploaded. Try again.');", true);
}
}
else
{
ScriptManager.RegisterStartupScript(UpdatePanel1, UpdatePanel1.GetType(), "alert", "alert('Data not available for selected year and month.');", true);
}
}
else
{
ScriptManager.RegisterStartupScript(UpdatePanel1, UpdatePanel1.GetType(), "alert", "alert('Select year & month');", true);
}

Google Places API works in Chrome but not in Firefox

I use the Google Places API and when I change address it works perfectly in Chrome but doesn't always work in Mozilla Firefox.
I use jQuery, Bootstrap 4 and JS and Symfony 4 for the backend.
function onPlaceChangedEditUser() {
console.log('1');
var place = this.getPlace();
$('.postal_code').val('');
for (var i in place.address_components) {
var component = place.address_components[i];
for (var j in component.types) {
var type_element = $('.' + component.types[j]);
if (component.types[j] == "country") {
$('#country').find('option').attr('selected', false);
$('#country').find('option[data-country="' + component.short_name + '"]').attr('selected', true);
$('#country_iso').val(component.short_name);
$('#country').change();
$('.country-short').val(component.short_name);
if ($('.country').length) {
$.ajax({
url: Routing.generate("front.dashboardbabysitter.find.language"),
type: "POST",
headers: {
"cache-control": "no-cache"
},
async: false,
cache: false,
data: {
'isoCountry': component.short_name
},
success: function(json) {
if (!json.hasError) {
$('.country option:selected').removeAttr('selected');
$('.country option[value=' + json.idLanguage + ']').attr('selected', 'selected');
$('.country').val(json.idLanguage);
}
},
error: function(XMLHttpRequest, textStatus) {
if (textStatus !== 'abort') {
var error = "TECHNICAL ERROR: unable to send login informations \n\nDetails:\nError thrown: " + XMLHttpRequest + "\n" + 'Text status: ' + textStatus;
$.growl.error({
message: error
});
return false;
}
},
complete: function() {}
});
}
if (jQuery.inArray(component.short_name, mp_country_prefix)) {
var phone_number = '+' + mp_country_prefix[component.short_name];
var flag_class = (component.short_name).toLowerCase();
$('#flag').removeClass().addClass('flag position-absolute ' + flag_class);
$('#phone').val(phone_number);
} else {
console.log('there is no iso');
}
}
if (type_element) {
type_element.val(component.long_name);
}
if ($("#latitude").length) {
$("#latitude").val(place.geometry.location.lat());
$("#longitude").val(place.geometry.location.lng());
}
if ($(".latitude").length) {
$(".latitude").val(place.geometry.location.lat());
$(".longitude").val(place.geometry.location.lng());
}
if ($('#address1').length) {
$('#address1').val($('.street_number').val() + ' ' + $('.route').val())
}
if ($('#edit_babysitter_personal_info_address_address1').length) {
$('#edit_babysitter_personal_info_address_address1').val($('.street_number').val() + ' ' + $('.route').val())
}
if ($('#parent_personal_info_address_address1').length) {
$('#parent_personal_info_address_address1').val($('.street_number').val() + ' ' + $('.route').val())
}
}
}
}
function initializeAutocomplete(id) {
var element = document.getElementById(id);
if (element) {
var autocomplete = new google.maps.places.Autocomplete(element, {
types: ['geocode'],
language: _mpop.current_lang
});
if (id == "parent_personal_info_fullAddress" || id == "edit_babysitter_personal_info_fullAddress" ||
id == "address_bb" || id == "home_address") {
google.maps.event.addListener(autocomplete, 'place_changed', onPlaceChangedEditUser);
}
}
}

You can use addEventListener instead of addListener
Reference - link
Identify the browser and apply the event accordingly.

why my ajax makes me to refresh my page to see content?

I want when my ajax detect changes on database automatically show the content in html without refresh , but it isnt doing nothing. I have to refresh the page , how can I fix it? I am trying to do ajax long polling
$(function(doc, win, $) {
var has_focus = true;
var notification = win.Notification || win.mozNotification || win.webkitNotification;
var $badge = $("#notifications-badge");
var $list = $("#notifications-list");
var $button = $("#notifications-button");
URL_GET_NOTIFICATION = BASE_URL + 'notify/pusher';
URL_GET_NOTIFICATION_UPDATE = BASE_URL + 'notify/update';
if ('undefined' === typeof notification) {
console.log('Web notification not supported');
} else {
notification.requestPermission(function(permission) {});
}
function check_notifications(timestamp) {
$.ajax({
type: 'GET',
url: URL_GET_NOTIFICATION,
data: { timestamp : timestamp },
dataType: 'json',
async: true,
success: function (data) {
for (var i in data.notifications) {
notify(data.notifications[i].message, data.notifications[i].type, data.notifications[i].timestamp);
}
check_notifications(data.timestamp);
}
});
}
function notify(message, type, created_at) {
var type_txt = 'info';
var url = '#';
var icon = 'info-circle';
if (type == 0) {
type_txt = 'success';
icon = 'check';
} else if (type == 1) {
type_txt = 'info';
icon = 'exclamation';
} else if (type == 2) {
type_txt = 'warning';
icon = 'exclamation-triangle';
} else if (type == 3 || type == 4) {
type_txt = 'danger';
icon = 'fire';
}
$badge.show();
$badge.text(parseInt($badge.text()) + 1);
$list.find(".item").eq(13).nextAll(".item").remove();
var item = '<li class="item text-' + type_txt + '"><a href="' + url + '"><span class="text-' + type_txt + '">' +
'<i class="fa fa-' + icon + ' fa-fw"></i> ' + message.substr(0, 22) + '</span>' +
'<span class="pull-right text-muted small" data-time="' + created_at + '">X</span></a></li>' +
'<li class="item divider"></li>';
$list.prepend(item);
$('.dropdown.open .dropdown-toggle').dropdown('toggle');
return true;
}
$(win).on("blur", function () {
has_focus = false;
});
$(win).on("focus", function () {
has_focus = true;
});
$button.on("click", function () {
$badge.fadeOut(300, function () {
$badge.text(0);
});
$list.find("span[data-time]").each(function (index) {
var $this = $(this);
$this.text(moment.unix($this.data('time')).fromNow());
});
});
check_notifications();
}(document, window, jQuery));