Develop Reference

Add dynamic input field in ajax

Is there a way to put a dynamic input inside ajax? I am using hayageek jquery file upload. I wanted to add an input as hidden inside the form upload for replacing a file. Any help would be much appreciated.
The div that handles upload:
<div id="replacefile">Upload</div>
I wanted to put: <input type="text" name="replace">
$("#replacefile").uploadFile({
url : newurl,
fileName : "myfile",
returnType : "json",
dragDrop : true,
showFileCounter: false, // show numbered list of file
allowDuplicates: false,
multiple : true, //allow multiple file upload
showFileSize : false, // show file size
acceptFiles : "doc,pdf",
onSuccess : function(files,data,xhr,pd) {
// success
},
onError : function() {
// error
}
});

$("#replacefile").uploadFile({
url : newurl,
fileName : "myfile",
returnType : "json",
dragDrop : true,
showFileCounter: false, // show numbered list of file
allowDuplicates: false,
multiple : true, //allow multiple file upload
showFileSize : false, // show file size
acceptFiles : "doc,pdf",
onSuccess : function(files,data,xhr,pd) {
// success
var input=$('<input type="text" name="replace">');
$('#replacefile').find('form').append(input);
},
onError : function() {
// error
}
});

Load ajax success data on new page

My ajax call hits the controller and fetches a complete JSP page on success. I was trying to load that data independently on a new page rather than within some element of the existing page. I tried loading it for an html tag but that didn't work either. I tried skipping the success function but it remained on the same page without success data. My ajax call is made on clicking a normal button in the form and the code looks like as shown below.
$.ajax({
url : '/newpage',
type : 'POST',
data : requestString,
dataType : "text",
processData : false,
contentType : false,
success : function(completeHtmlPage) {
alert("Success");
$("#html").load(completeHtmlPage);
},
error : function() {
alert("error in loading");
}
});

This should do:
$.ajax({
url : '/newpage',
type : 'POST',
data : requestString,
dataType : "text",
processData : false,
contentType : false,
success : function(completeHtmlPage) {
alert("Success");
$("html").empty();
$("html").append(completeHtmlPage);
},
error : function() {
alert("error in loading");
}
});

You can try this,
my_window = window.open("");
my_window.document.write(completeHtmlPage);
into your success.

Load fancybox when ajax returns ERROR

Here is the scenario:
My AJAX script determines whether or not a user is logged in when he clicks on an action.
When the user is not logged in, AJAX returns error. I want to load div which contains login form on a fancybox.
How can I do this?
Here is what I have:
$.ajax({
type : 'POST',
url : 'xyz.action',
dataType : 'text',
herf :'login.jsp',
success : function (data) {},
error : function () {
alert("PLEASE LOGIN");
$("#loginForm").fancybox({
'width' : '75%',
'height' : '75%',
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none',
'type' : 'iframe'
});
}
});
return false;
Login

I got the solution :)...
$("#fan").fancybox({
'enableEscapeButton' :true,
'type':"iframe",
href :'login.jsp',
'hideOnOverlayClick' : true
}).trigger('click');

Try
$.fancybox('login.jsp');
If that doesn't work, I like to do this:
$.post('login.jsp',function(data){$.fancybox(data);});

How to read extra properties from model store EXTJs?

​Json reader in is defined for the store as follows:
Ext.define('App.store.MyList', {
extend : 'Ext.data.Store',
model : 'App.model.MyList',
pageSize : 100,
proxy : {
type : 'ajax',
actionMethods : {
create : 'POST',
read : 'POST',
update : 'POST',
destroy : 'POST'
},
root : 'results',
url : 'aaa.htm',
reader : {
type : 'json',
root : 'results',
totalProperty: 'totalCount',
extraProperty: 'abcd'
},
simpleSortMode : true
}
});
How do I read extra property outside the root? I tried to put one inside the reader, it did not work.

try this
grid.getStore().getProxy().getReader().extraProperty

Uploadify error with Internet Explorer 9

Hi I am trying to use JQuery Uploadify plugin using the following code:
$('input#uploadFile_CSV').uploadify({
'uploader' : '/images/uploadify.swf',
'cancelImg' : '/images/cancel.png',
'script' : 'RequestController',
'buttonText': 'Import CSV',
'scriptData': {'command': 'ImportCSVFileCommand',
'workspaceId': $.workspaceGlobalInformation.id},
'method' : 'GET',
'auto': true,
'onComplete' : function(event, ID, fileObj, response, data) {
resetCSVDialogOptions();
showCSVImportOptions(response);
}
});
I keep getting a HTTP error and I can't read my script data at the server end. Any help would be appreciated. Thanks.