Error calling method on NPObject! - javascript

Sorry for my English
I updated my uploadify to recent version (Uploadify-v2.1.4) and that broked my uploadify:
I can't upload anything . FireBug console returns this erroe when I'm trying to call "Error calling method on NPObject!".
What am I doing wrong?!
Here's my code:
http://pastebin.com/bHeYHxHw
Thanks,
Daniil.

/* Original code */
uploadifyCancel:function(ID) {
jQuery(this).each(function() {
document.getElementById(jQuery(this).attr('id') + 'Uploader').cancelFileUpload(ID, true, true, false);
});
},
/*New code */
uploadifyCancel:function(ID){
jQuery(this).each(function(){
document.getElementById(jQuery(this).attr("id")+"Uploader").cancelFileUpload(ID,true,false)
});
},
/*Original code */
jQuery(this).bind("uploadifyComplete", {
'action': settings.onComplete
}, function(event, ID, fileObj, response, data) {
if (event.data.action(event, ID, fileObj, unescape(response), data) !== false) {
jQuery("#" + jQuery(this).attr('id') + ID).find('.percentage').text(' - Completed');
if (settings.removeCompleted) {
jQuery("#" + jQuery(event.target).attr('id') + ID).fadeOut(250,function() {
jQuery(this).remove()
});
}
jQuery("#" + jQuery(event.target).attr('id') + ID).addClass('completed');
}
});
/* New code */
jQuery(this).bind("uploadifyProgress", {
'action': settings.onProgress,
'toDisplay': settings.displayData
}, function(event, ID, fileObj, data) {
if (event.data.action(event, ID, fileObj, data) !== false) {
jQuery("#" + jQuery(this).attr('id') + ID + "ProgressBar").animate({
'width': data.percentage + '%'
},250,function() {
if (data.percentage == 100) {
jQuery(this).closest('.uploadifyProgress').fadeOut(250,function() {
jQuery(this).remove()
});
}
});
if (event.data.toDisplay == 'percentage') displayData = ' - ' + data.percentage + '%';
if (event.data.toDisplay == 'speed') displayData = ' - ' + data.speed + 'KB/s';
if (event.data.toDisplay == null) displayData = ' ';
jQuery("#" + jQuery(this).attr('id') + ID).find('.percentage').text(displayData);
}
});

Related

Retrieving of Data with different JSON formats

I am using jQuery and javascript in an ASP.NET Code
Below are the 2 functions that retrieve data in different formats
jQuery.ajax({
url: URL,
success: function (data) {
debugger;
try {
window["DataList"] = eval(data);
}
catch (e) {
window["DataList"] = [];
}
if (typeof (DataList) === "undefined" || !jQuery.isArray(DataList) || DataList.length === 0 || !DataList[0].id) {
jQuery("#" + divnomatch).text("No Matches Found.");
jQuery("#" + divnomatch).css("visibility", "visible");
jQuery("#" + divnomatch).css("display", "inline");
jQuery("#" + hdnid).val("");
jQuery("#" + hdnname).val("");
response([]);
}
else {
debugger;
jQuery("#" + divnomatch).css("visibility", "hidden");
jQuery("#" + divnomatch).css("display", "none");
fnShowHideObjTR("trResultsForRAUsers", false);
response(jQuery.map(DataList, function (item) {
return {
label: item.value,
value: item.value,
ID: item.id,
lNo: item.lNo,
eMail: item.eMail,
phyBUID: item.phyBUID
}
}));
}
}
});
For this, the data comes as below...
Below is the function that retrieves data in different format
jQuery.ajax({
url: URL,
success: function (data) {
switch (data) {
case 'NoMatch':
jQuery("#" + divnomatch).text("No User's last name starts with '" + searchtext + "'.");
jQuery("#" + divnomatch).css("visibility", "visible");
jQuery("#" + divnomatch).css("display", "inline");
jQuery("#" + hdnid).val("");
jQuery("#" + hdnname).val("");
break;
case data.charAt(0) == "|":
lblErrorMessage.innerHTML = "Error occurred while retrieving the data: " + data.substring(1);
fnShowHideSpan("spanError", true);
break;
case data.charAt(0) == "<":
lblErrorMessage.innerHTML = "The server has not responded promptly to your \"Search as you Type\" queries. Please try again after a few minutes.";
fnShowHideObj("spanError", true);
break;
default:
debugger;
jQuery("#" + divnomatch).css("visibility", "hidden");
jQuery("#" + divnomatch).css("display", "none");
var rows = data.split("|");
var jsStr = "var DataList=[";
for (var i = 0; i < rows.length - 1; i++) {
var s = rows[i].toString();
s = s.replace(/'/g, "\\'");
var row = s.split("~");
jsStr += "{id:'" + row[0].toString() + "'";
jsStr += ",value:'" + row[1].toString() + "'},";
}
jsStr = jsStr.slice(0, jsStr.length - 1);
jsStr += "];";
eval(jsStr);
if (typeof (DataList) != 'undefined') {
response(jQuery.map(DataList, function (item) {
return {
label: item.value,
value: item.value,
ID: item.id
}
}));
}
}
},
error: function (e) {
lblErrorMessage.innerHTML = "The server has not responded promptly to your \"Search as you Type\" queries. Please try again after a few minutes.";
fnShowHideObj("spanError", true);
}
});
Below is the data format in data variable
The second function works properly with the data and with its unique pipe seperator. How can I modify the code for first function which contains array of items to be pulled even with comma separator in the field in the front end as below...
So the problem that first function doesn't work at all or it formats the response to the incorrect format?
The suspicious thing I see now is the one of the conditions in the first if statement. !DataList[0].id would evaluate to true in case there is and object with ID equals to 0 which is incorrect logic I assume.

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.

Html5 data attribute is not updating after ajax request

i have two data attributes one in decreasing every second and is 0 when the first attribute reach 0 an ajax request is send to get the second data value but when i set the value to the second data attribute is not changed in html but when i printed it changed !!!
my code
setInterval(
function () {
if ($j('#auctions-widget .auction_hours').length) {
var auctions_hours = [];
$j('#auctions-widget .auction_hours').each(function () {
auctions_hours.push($j(this).data('auction-id'));
});
for (var i = 0; i < auctions_hours.length; i++) {
checkAuctionHours(auctions_hours[i]);
}
}
}
, 1000);
function checkAuctionHours(auction_id) {
//var TimeWorker = new Date();
var auction_hours = $j("body").find(".auction_hours[data-auction-id='" + auction_id + "']");
if (auction_hours.length) {
//if(auction_id == 1637 && (auction_hours.data("open-contest-hours") !=0 || auction_hours.data("close-contest-hours")!=0) ){
//console.log('time to open-contest-hours: ' + auction_hours.data("open-contest-hours") + ' id= ' + auction_id);
//console.log('time to close-contest-hours: ' + auction_hours.data("close-contest-hours") + ' id= ' + auction_id);
//}
if (auction_hours.data("open-contest-hours") != 0) {
auction_hours.data("open-contest-hours", auction_hours.data("open-contest-hours") - 1);
console.log('time to open-contest-hours: ' + auction_hours.data("open-contest-hours") + ' id= ' + auction_id);
//validate_auctions_hours_time(auction_id, 'open');
//console.log('open');
//console.log(auction_id);
if (auction_hours.data("open-contest-hours") == 0) { //time to open auction based on auction hours
//send the ajax to check;
//console.log('open');
validate_auctions_hours_time(auction_id, 'open');
}
} else if (auction_hours.data("close-contest-hours") != 0) {
auction_hours.data("close-contest-hours", auction_hours.data("close-contest-hours") - 1);
console.log('time to close-contest-hours: ' + auction_hours.data("close-contest-hours") + ' id= ' + auction_id);
//validate_auctions_hours_time(auction_id, 'close');
if (auction_hours.data("close-contest-hours") == 0) { //time to close auction based on auction hours
//send the ajax to check;
//console.log('close');
validate_auctions_hours_time(auction_id, 'close');
}
} else if (auction_hours.data("open-contest-hours") == 0 && auction_hours.data("close-contest-hours") == 0) {
} else {
}
}
}
ajax code
function validate_auctions_hours_time(auction_id, auction_hours_status) {
$.ajax({
async: true,
url: my_ajax_script.ajaxurl,
type: 'POST',
data: ({
type: 'POST',
action: 'validate_auction_hours_time',
auction_id: auction_id,
auction_hours_status: auction_hours_status
}),
success: function (response) {
var auction_hours = $("body").find(".auction_hours[data-auction-id='" + auction_id + "']");
var auction_hours_img = '';
if (response.time_status == 'OK') {
if (response.auction_hours_open_time) { //close auction till next from auction hours
//auction_hours.data('open-contest-hours', response.auction_hours_open_time);
auction_hours.attr('data-open-contest-hours', response.auction_hours_open_time);
console.log(auction_hours.attr('data-open-contest-hours'));
auction_hours_img = $("body").find(".open-hours-active[data-auction-hours-img='" + auction_id + "']");
auction_hours_img.removeClass('open-hours-active');
auction_hours_img.parent().removeClass('auction_hours_blink').removeClass('auction_hours_reset_blink');
auction_hours_img.parent().addClass('auction_hours_blink');
auction_hours_img.addClass('open-hours-deactive');
$('#' + auction_hours_img.data('selector')).html(response.tool_tip);
} else if (response.auction_hours_close_time) { //open auction till next to auction hours
//auction_hours.data('close-contest-hours', response.auction_hours_close_time);
auction_hours.attr('data-close-contest-hours', response.auction_hours_close_time);
console.log(auction_hours.attr('data-close-contest-hours'));
console.log(auction_hours);
auction_hours_img = $("body").find(".open-hours-deactive[data-auction-hours-img='" + auction_id + "']");
auction_hours_img.removeClass('open-hours-deactive');
auction_hours_img.parent().removeClass('auction_hours_blink').removeClass('auction_hours_reset_blink');
auction_hours_img.parent().addClass('auction_hours_blink');
auction_hours_img.addClass('open-hours-active');
$('#' + auction_hours_img.data('selector')).html(response.tool_tip);
}
}
else if (response.time_status == 'RESET') {
if (response.auction_hours_open_time) { //sync auction to auction hours
auction_hours_img = $("body").find(".open-hours-deactive[data-auction-hours-img='" + auction_id + "']");
auction_hours.data('open-contest-hours', response.auction_hours_open_time);
auction_hours_img.parent().removeClass('auction_hours_reset_blink').removeClass('auction_hours_blink');
auction_hours_img.parent().addClass('auction_hours_reset_blink');
} else if (response.auction_hours_close_time) { //sync auction from auction hours
auction_hours_img = $("body").find(".open-hours-active[data-auction-hours-img='" + auction_id + "']");
auction_hours.data('close-contest-hours', response.auction_hours_close_time);
auction_hours_img.parent().removeClass('auction_hours_reset_blink').removeClass('auction_hours_blink');
auction_hours_img.parent().addClass('auction_hours_reset_blink');
} else {
}
}
},
error: function (jqXHR, textStatus, errorThrown) {
response_errors_handling(jqXHR, textStatus, errorThrown);
}
});
finally i try to replace all the auction_hours.data with auction_hours.attr in all the code and it work fine.

How to get plupload to remove a file from queue?

I have literally been trying to figure this out for the past 5 hours.
I have tried countless methods that I have found online and none have worked. So far, this method worked the best(only shows one error).
The error that I get is: "Uncaught ReferenceError: deletefile is not defined"
Please note that the error only occurs when I click the "Remove" hyperlink.
//UPLOAD CODE
$(document).ready(function() {
// Custom example logic
function $(id) {
return document.getElementById(id);
}
var uploader = new plupload.Uploader({
runtimes : 'gears,html5,flash,silverlight,browserplus',
browse_button : 'pickfiles',
container: 'container',
drop_element: 'uploadBox',
max_file_size : '10mb',
url : 'upload.php',
flash_swf_url : '../js/plupload/plupload.flash.swf',
silverlight_xap_url : '../js/plupload/plupload.silverlight.xap',
filters : [
{title : "Image files", extensions : "jpg,gif,png"},
{title : "Zip files", extensions : "zip"}
]
//,
//multipart_params : {
// "title" : $("#title").val(),
// "descripition" : $("#description").val()
//}
});
uploader.bind('Init', function(up, params) {
if (uploader.features.dragdrop) {
var target = $("uploadBox");
target.ondragover = function(event) {
event.dataTransfer.dropEffect = "move";
this.className = "dragover";
};
target.ondragenter = function() {
this.className = "dragover";
};
target.ondragleave = function() {
this.className = "";
};
target.ondrop = function() {
this.className = "";
};
}
});
uploader.bind('FilesAdded', function(up, files) {
function deletefile(i) {
uploader.splice(i,1);
}
for (var i in files) {
$('filelist').innerHTML += '<div id="' + files[i].id + '">' + files[i].name + ' (' + plupload.formatSize(files[i].size) + ') Remove<b></b></div>';
}
});
uploader.bind('UploadProgress', function(up, file) {
$(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>";
});
$('uploadfiles').onclick = function() {
uploader.start();
return false;
};
uploader.init();
});
Thanks.
Assuming filelist is an id (so, using $('#filelist')), you may try to replace this :
uploader.bind('FilesAdded', function(up, files) {
function deletefile(i) {
uploader.splice(i,1);
}
for (var i in files) {
$('filelist').innerHTML += '<div id="' + files[i].id + '">' + files[i].name + ' (' + plupload.formatSize(files[i].size) + ') Remove<b></b></div>';
}
});
with this :
uploader.bind('FilesAdded', function(up, files) {
var deleteHandle = function(uploaderObject, fileObject) {
return function(event) {
event.preventDefault();
uploaderObject.removeFile(fileObject);
$(this).closest("div#" + fileObject.id).remove();
};
};
for (var i in files) {
$('#filelist').append($('<div id="' + files[i].id + '">' + files[i].name + ' (' + plupload.formatSize(files[i].size) + ') Remove</div>'));
$('#deleteFile' + files[i].id).click(deleteHandle(up, files[i]));
}
});
I also suppose $('uploadfiles') should be $('#uploadfiles') but it is out of scope of the question.
Hope this will help.
// jquery plugin
uploader.plupload('getUploader').splice();
$('.plupload_filelist_content', uploader).empty();
uploader=newplupload.Uploader({
//-----
});
uploader.bind('FilesAdded',function(up,files)
{
//----
up.refresh();//RepositionFlash/Silverlight
});
uploader.bind('QueueChanged',function(up,files){
//#doc-filelist is the id of dive, which shows the Queue
$('#doc-filelist').html('');
$.each(uploader.files,function(i,file){
$('#doc-filelist').append(
'<divid="'+file.id+'">'+
file.name+'('+plupload.formatSize(file.size)+')<b></b>'+
'<spanclass="remove_file"data-file="'+i+'">X</span>'+
'</div>');
});
if(uploader.files.length==0){
$('#uploadfiles').addClass('disabled');
}
//console.log(uploader.files);
});
uploader.bind('UploadComplete', function (up, file) {
up.splice();
up.refresh();
});
$('.relevant-document').on('click','.remove_file',function(e){
uploader.splice($(this).attr('data-file'),1);
uploader.refresh();
});

problem ajax load with autocomplete.?

i created a jquery autocomplete it work true, but loading LOADING... it after removed value by Backspace don't work true. it not hide and Still is show.
how can after removed value by Backspace, hide LOADING... ?
EXAMPLE: Please click on link and see problem
my full code:
$(document).ready(function () {
/// LOADING... ///////////////////////////////////////////////////////////////////////////////////////
$('#loadingDiv')
.hide() // hide it initially
.ajaxStart(function() {
$(this).show();
})
.ajaxStop(function() {
$(this).hide();
});
/// autocomplete /////////////////////////////////////////////////////////////////////////////////////////
$('.auto_complete').keyup(function () {
var specific = '.' + $(this).closest('div.auto_box').find('b').attr('class');
var cl_list = '.' + $(this).closest('div.auto_box').find('ul').attr('class');
var id = '#' + this.id;
var url = $(id).attr('class');
var dataObj = $(this).closest('form').serialize();
$.ajax({
type: "POST",
dataType: 'json',
url: url,
data: dataObj,
cache: false,
success: function (data) {
//alert(url)
var cl_list = '.' + $('.auto_box '+ specific +' ul').attr('class');
var id_name = $(cl_list).attr('id');
$(cl_list).show().html('');
if (data == 0) {
$(cl_list).show().html('<p><b>There is no</b></p>');
}
else {
$.each(data, function (a, b) {
//alert(b.name)
$('<p id="' + b.name + '">' + b.name + '</p>').appendTo(cl_list);
});
$(cl_list + ' p').click(function (e) {
e.preventDefault();
var ac = $(this).attr('id');
$('<b>' + ac + '، <input type="text" name="'+id_name+'[]" value="' + ac + '" style="border: none; display: none;" /></b>').appendTo($('.auto_box ' + specific + ' span'));
$(this).remove();
return false;
});
$('.auto_box span b').live('click', function (e) {
e.preventDefault();
$(this).remove();
return false;
});
}
if ($(specific + ' input').val() == '') {
$(cl_list + " p").hide().remove();
$(cl_list).css('display','none');
$(".list_name").show().html('');
};
$('body').click(function () {
$(cl_list + " p").hide().remove();
$('.auto_complete').val('');
$(cl_list).show().html('');
$(cl_list).css('display','none')
});
},
"error": function (x, y, z) {
// callback to run if an error occurs
alert("An error has occured:\n" + x + "\n" + y + "\n" + z);
}
});
});
});
I recommend you to use jsfiddle next time you post code examples in a link.
Nevermind. The "loading" message keeps there because there's no fallback to empty values on results.
A quick fix could be just by test that there's a value in the input before making any post like if(this.value == ""){
$(cl_list).css('display', 'none');
return false;
}
Here's how it works with it

Categories

Resources