Previously, I downloaded a jQuery Ajax upload plug-in from the Internet. The upload category is on the left side of the webpage. The following is a function to be implemented: I originally intended to create different folders on the server to save files based on the upload category. Therefore, we need to upload a classification parameter to the background. These upload categories are read from the database and generated using repeater. When you click a category, set a style for it and save the category name to the variable uploadCatlog. I can retrieve the category and send it to the background. However, it is strange that the classification is correct for the first time and will not be updated every time. In fact, uploadCatlog is also used in the onComplete callback function of the upload plug-in, and its value has been updated. I feel like this upload plug-in is only instantiated when I click it for the first time and passes the parameter to the backend, so the values will remain unchanged in the future. How can I solve this problem? Below are the details of my js Code:
JavaScript code:
Copy codeThe Code is as follows:
<Script type = "text/javascript">
$ (Function (){
Var uploadCatlog;
// Set the selected style in the navigation bar of the master page
$ ("# Menu. nav5"). addClass ("menu_active"). siblings (). removeClass ("menu_active ");
// Generate category menu styles and navigation menus
$ ("# Kllst li"). click (function (){
$ (This). addClass ("currentli"). siblings (). removeClass ();
UploadCatlog = $ (this). text ();
});
Var btnUpload = $ ('# upload ');
Var status = $ ('# status ');
BtnUpload. click (function (){
If (uploadCatlog = undefined ){
Status. text ("You must select the type of the uploaded file first! "). AddClass ('error ');
Return false;
}
New AjaxUpload (btnUpload ,{
Action: 'handler/doUpload. ashx ',
Name: 'uploadfile ',
OnSubmit: function (file, ext ){
If (! (Ext &/^ (doc | docx | xls) $/. test (ext ))){
Status. text ('only supports WORD, EXCEL format upload! '). AddClass ('error ');
Return false;
}
Status. text ('upload in progress, please wait ...');
},
Data: {"catlog": uploadCatlog },
OnComplete: function (file, response ){
Status. text (''). removeClass ('error ');
If (response = "success "){
Var fimgtype;
If (file. indexOf (". doc ")! =-1 | file. indexOf (". docx ")! =-1 ){
Fimgtype = "word ";
}
If (file. indexOf (". xls ")! =-1 ){
Fimgtype = "excel ";
}
$ ('<Li> </li> '{.appendto('{files'}.html (' <br/> [' + uploadCatlog + ']' + file ). addClass ('success ');
} Else {
$ ('<Li> </li>'). appendTo ('# files'). text (file). addClass ('error ');
}
}
});
});
});
</Script>
Then I found a solution, that is, it will not change after the instance is created. You can call the SetData method in the onSubmit callback function to set the dynamic parameters, as shown in the following code and comments:
JavaScript code:
// You can use these methods to configure AJAX upload.
Var upload = new AjaxUpload ('# div_id', {action: 'upload. php '});
// For example, when you select something and set some parameters
Upload. setData ({"catlog ":
The submission of ajax upload parameters will always cause problems due to various errors. However, it is a difficult question to learn how to solve the problem and how to use the best solution, if you want to solve the problems in the programming process well, you still need to constantly study and learn!