Support forums » Products » Ajax Uploader » Re: CuteWebUI_AjaxUploader_OnStart() Not being called!

Re: CuteWebUI_AjaxUploader_OnStart() Not being called!

  •  08-18-2009, 2:27 PM

    Re: CuteWebUI_AjaxUploader_OnStart() Not being called!

    Reply Quote
    I've narrowed down the problem a bit more:
     
    It seems that when the uploader is in the view plainly it will call all the javascript functions no problem.  But when i put the uploader into a view that is added to another view using render action It won't call any of the javascript functions. 
     
    So my code that isn't working actually looks like this:
     
    This is the view that is put into the other view using render action:
     
    1. <%@ Page Title="" Language="VB" MasterPageFile="~/Views/Shared/ExtraPlain.Master" Inherits="System.Web.Mvc.ViewPage" %>  
    2. <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">  
    3. <script type="text/javascript">  
    4.     var handlerurl = '<%=Url.Action("AjaxSubmit", "FileUpload") %>'  
    5.     </script>  
    6.     <script type="text/javascript">  
    7.        function CuteWebUI_AjaxUploader_OnPostback()  
    8.         {  
    9.             //$('#SendMail').attr("disabled", "disabled");   
    10.              
    11.             var uploader = document.getElementById("TheFileUploader");  
    12.             var guidlist = uploader.value;  
    13.             var otherinfo = document.getElementById("otherinfo").innerHTML;  
    14.             //Send Request  
    15.   
    16.             $.post(  
    17.                 handlerurl,  
    18.                 { guidlist: guidlist, otherinfo: otherinfo },  
    19.                 function(data, status) {  
    20.                     if (status != "success") {  
    21.                         alert("http error " + status);  
    22.                         setTimeout(function() { document.write(xh.responseText); }, 10);  
    23.                         return;  
    24.                     }  
    25.                       
    26.                     var filelist = document.getElementById("filelist");  
    27.   
    28.                     var list = eval(data); //get JSON objects  
    29.                       
    30.                     for (var i = 0; i < list.length; i++)  
    31.                     {  
    32.                         var item = list[i];  
    33.                         var msg;  
    34.                         if (item.Error != null)  
    35.                         {  
    36.                             msg = "Error " + item.FileGuid + " - " + item.Error;  
    37.                         }  
    38.                         else  
    39.                         {  
    40.                             msg = "Processed : " + list[i].FileName;  
    41.                         }  
    42.                         var li = document.createElement("li");  
    43.                         li.innerHTML = msg;  
    44.                         filelist.appendChild(li);  
    45.                       
    46.                     }  
    47.   
    48.   
    49.                 }  
    50.              );  
    51.              uploader.reset();  
    52.                
    53.         }  
    54.       
    55.     </script>  
    56.   
    57.     <button id="uploadbutton" onclick="return false;" name="uploadbutton">Select file(s) to upload</button>  
    58.     <%=ViewData("uploaderhtml") %>  
    59.     <ol id="filelist"></ol>  
    60.   
    61.       
    62. </asp:Content> 

    and this is the view that is the main view:
    1. <%@ Page Title="" Language="VB" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>  
    2.   
    3. <asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">  
    4.     EmailForm  
    5. </asp:Content>  
    6.   
    7. <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">  
    8. <script type="text/javascript">  
    9.       
    10. </script>  
    11.     <h2>EmailForm</h2>  
    12.       
    13.     <label for="TheFileUploader">Select Files to Upload:</label><%  Html.RenderAction("EmailUpload", "FileUpload")%>  
    14.     <%Html.BeginForm()%>  
    15.     <br />  
    16.     <label for="ToField">To:</label><%=Html.TextBox("ToField")%>  
    17.     <br />  
    18.     <label for="Subject">Subject:</label><%=Html.TextBox("Subject")%>  
    19.     <br />  
    20.     <label for="Body">Body:</label><%=Html.TextArea("Body", "", 10, 50, "")%>  
    21.     <br />  
    22.     <input type="submit" name="SendMail" id="SendMail" value="Send Mail" />  
    23.     <%html.endform() %>  
    24.       
    25. </asp:Content> 
     and last but not least:  this is the html that is actually rendered in the browser:
     
    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
    2. <html xmlns="http://www.w3.org/1999/xhtml">  
    3. <head><title>  
    4.       
    5.     EmailForm  
    6.   
    7. </title><link href="../../Content/Site.css" rel="stylesheet" type="text/css" /><link href="../../Content/ui.timepickr.css" rel="stylesheet" type="text/css" /><link href="../../Content/jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css" /><link href="../../Content/styles.css" rel="stylesheet" type="text/css" />  
    8. <script src="/Scripts/MicrosoftAjax.debug.js" type="text/javascript"></script>  
    9. <script src="/Scripts/MicrosoftMvcAjax.debug.js" type="text/javascript"></script>  
    10. <script src="/Scripts/jquery-1.3.2.min.js" type="text/javascript"></script>  
    11. <script src="/Scripts/jquery.validate.min.js" type="text/javascript"></script>  
    12. <script src="/Scripts/xval.jquery.validate.js" type="text/javascript"></script>  
    13. <script src="/Scripts/jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script>  
    14.   
    15.   <script src="/Scripts/jquery.meio.mask.min.js" type="text/javascript"></script>  
    16.     <script src="/Scripts/jquery.autocomplete.min.js" type="text/javascript"></script>  
    17.   
    18. <script scr="~Scripts/jquery-1.3.2-vsdoc.js"></script>  
    19. <script type="text/javascript">  
    20.     function HandleError(ajaxContext) {  
    21.         var response = ajaxContext.get_response();  
    22.         var statusCode = response.get_statusCode();  
    23.         alert("Sorry the request failed with status code:" + statusCode);  
    24.     }  
    25.   
    26.     function OnItemDeleted(name) {  
    27.         document.getElementById("message").innerHTML = name + "was deleted";  
    28.         var deletedNode = document.getElementById("item_" + name);  
    29.         deletedNode.parentNode.removeChild(deletedNode);  
    30.   
    31.     }  
    32.       
    33.     function NumberValidator(num){  
    34.         var exp = new RegExp("[-+]?(?:\d\,?){0,}(?:\.\d*)?");  
    35.         if(num.match(exp)){  
    36.             return true;  
    37.         }  
    38.         else{  
    39.             return false;  
    40.         }  
    41.           
    42.           
    43.     }  
    44.       
    45. </script>  
    46.   
    47. <style type="text/css">  
    48.     label.error{  
    49.         background-color:Maroon;  
    50.         border: outset 4px pink;  
    51.         color:Black;  
    52.     }  
    53.       
    54.     
    55.   </style>  
    56. </head>  
    57.   
    58. <body>  
    59.   
    60.     <div class="page">  
    61.   
    62.         <div id="header">  
    63.             <div id="title">  
    64.                 <h1>My MVC Application</h1>  
    65.                 <span><a href="#ctl00_ctl01_SkipLink"><img alt="Skip Navigation Links" height="0" width="0" src="/WebResource.axd?d=1wTXeqgqOaplM9A-7cl9Gw2&t=633699391382867883" style="border-width:0px;" /></a><a id="ctl00_ctl01_SkipLink"></a></span>  
    66.             </div>  
    67.                 
    68.             <div id="logindisplay">  
    69.                   
    70.   
    71.         [ <a href="/Account.mvc/LogOn">Log On</a> ]  
    72.                       
    73.             </div>   
    74.               
    75.             <div id="menucontainer">  
    76.   
    77.               
    78.                 <ul id="menu">                
    79.                     <li><a href="/Home.mvc">Home</a></li>  
    80.                     <li><a href="/Home.mvc/About">About</a></li>  
    81.                 </ul>  
    82.               
    83.             </div>  
    84.         </div>  
    85.   
    86.         <div id="main">  
    87.               
    88.   
    89. <script type="text/javascript">  
    90.       
    91. </script>  
    92.     <h2>EmailForm</h2>  
    93.       
    94.     <label for="TheFileUploader">Select Files to Upload:</label>  
    95.   
    96.   
    97.     <div>  
    98.           
    99. <script type="text/javascript">  
    100.     var handlerurl = '/FileUpload.mvc/AjaxSubmit'  
    101.     </script>  
    102.     <script type="text/javascript">  
    103.        function CuteWebUI_AjaxUploader_OnPostback()  
    104.         {  
    105.             //$('#SendMail').attr("disabled", "disabled");   
    106.              
    107.             var uploader = document.getElementById("TheFileUploader");  
    108.             var guidlist = uploader.value;  
    109.             var otherinfo = document.getElementById("otherinfo").innerHTML;  
    110.             //Send Request  
    111.   
    112.             $.post(  
    113.                 handlerurl,  
    114.                 { guidlist: guidlist, otherinfo: otherinfo },  
    115.                 function(data, status) {  
    116.                     if (status != "success") {  
    117.                         alert("http error " + status);  
    118.                         setTimeout(function() { document.write(xh.responseText); }, 10);  
    119.                         return;  
    120.                     }  
    121.                       
    122.                     var filelist = document.getElementById("filelist");  
    123.   
    124.                     var list = eval(data); //get JSON objects  
    125.                       
    126.                     for (var i = 0; i < list.length; i++)  
    127.                     {  
    128.                         var item = list[i];  
    129.                         var msg;  
    130.                         if (item.Error != null)  
    131.                         {  
    132.                             msg = "Error " + item.FileGuid + " - " + item.Error;  
    133.                         }  
    134.                         else  
    135.                         {  
    136.                             msg = "Processed : " + list[i].FileName;  
    137.                         }  
    138.                         var li = document.createElement("li");  
    139.                         li.innerHTML = msg;  
    140.                         filelist.appendChild(li);  
    141.                       
    142.                     }  
    143.   
    144.   
    145.                 }  
    146.              );  
    147.              uploader.reset();  
    148.                
    149.         }  
    150.       
    151.     </script>  
    152.   
    153.     <button id="uploadbutton" onclick="return false;" name="uploadbutton">Select file(s) to upload</button>  
    154.     <script type='text/javascript' src='/CuteWebUI_Uploader_Resource.axd?type=script&_ver='></script><input type='hidden' id='TheFileUploader' name='TheFileUploader' autocomplete='off' /><img id='TheFileUploader_Loader' UniqueID='TheFileUploader' Namespace='CuteWebUI' PageUpload='1' src='/CuteWebUI_Uploader_Resource.axd?type=file&file=continuous.gif' onload='this.style.display="none" ; CuteWebUI_AjaxUploader_Initialize(this.id);' onerror='this.onload()' ContextValue='!3wEWAQUVQzovVGVtcEZpbGVzRm9yRW1haWwvuuGz!1dtrc4Cq8W!1!3OQTciAKbwUQ!2' ShowProgressInfo="1" WindowsDialogLimitMsg="I don't know where this message is used" InserText="Upload a file" BorderStyle="border:1px solid #444444;" UploadUrl="/UploadHandler.ashx" MultipleFilesUpload="1" BarHeight="20" MaxFilesLimit="4" MaxFilesLimitMsg="that's enough files for you" InsertButtonID="uploadbutton" InfoStyle="padding-left:3px;font:normal 12px Tahoma;" FileTooLargeMsg="Are you crazy, that's to big!" CancelUploadMsg="Cancel Me NOW!!!" ResourceHandler="/CuteWebUI_Uploader_Resource.axd" UploadProcessingMsg="It's working away, be patient" UploadType="Auto" PanelWidth="360" ShowProgressBar="1" FileTypeNotSupportMsg="We don't accept those types of files around here" CancelAllMsg="Cancel them all i tell you, every one!" UploadingMsg="Uploading... Uploading...Uploading..." BarStyle="Continuous"/>  
    155.     <ol id="filelist"></ol>  
    156.   
    157.       
    158.   
    159.     </div>  
    160. <form action="/jqueryui/EmailForm/" method="post">  
    161.     <br />  
    162.     <label for="ToField">To:</label><input id="ToField" name="ToField" type="text" value="" />  
    163.   
    164.     <br />  
    165.     <label for="Subject">Subject:</label><input id="Subject" name="Subject" type="text" value="" />  
    166.     <br />  
    167.     <label for="Body">Body:</label><textarea Length="0" cols="50" id="Body" name="Body" rows="10">  
    168.   
    169.     <br>  
    170.     <input name="SendMail" id="SendMail" value="Send Mail" type="submit">  
    171.       
    172.   
    173.             <div id="footer">  
    174.             </div>  
    175.         
      </div>
          </div>
      </body>
      </html>
       
    176.      
     
    I hope this all makes sense to someone!  
View Complete Thread