.NET GENES

Good evening, This blog post demonstrates on how to upload or send a form with multiple files using HttpPostedFileBase class which is a property of a model class using jQuery and ajax in ASP.NET MVC. Given a sample model, I have declared a HttpPostedFileBase array property which is responsible for handling multiple files. public class clsWeeklyStatusReports { public Guid ID { get ; set ; } public string DomainName { get ; set ; } public string EmployeeName { get ; set ; } public DateTime SubmissionDate { get ; set ; } public string SubmissionDateDisplay { get { return SubmissionDate.ToString( "MM/dd/yyyy" ); } } public string MimeType { get ; set ; } public string FileName { get ; set ; } public HttpPostedFileBase[] Files { get ; set ; } public clsWeeklyStatusReportsGM() { ID = Guid.Empty; DomainName = string .Empty; EmployeeName = string .Empty; MimeType = string .Empty; FileName = string .Empty

Good evening! Adding a Bootstrap glyphicon to Ajax.ActionLink() helper is similar with Html.ActionLink() except that when the linkText parameter of the helper is empty, it will cause an Ajax issue and an Internal Server Error will be thrown from the browser. If you're going to integrate glyphicons on Ajax.ActionLink() helper and exclude the linkText property, supply that parameter with space instead of empty string so as not to cause jQuery or Ajax issues. @Ajax.ActionLink( " " , "DeleteComment" , "Home" , new { id = comment.CommentID }, new AjaxOptions { OnBegin = "return confirm('Are you sure you want to delete this comment?');" , InsertionMode = InsertionMode.Replace, UpdateTargetId = "event-details-" + Model.Id, HttpMethod = "GET" , }, new { @class = "commentDelete glyphicon glyphicon-trash" }); linkText i

Given that I have this code in my .cshtml page using Ajax.ActionLink() that calls a controller method using Ajax request: @Ajax.ActionLink( "Select" , "TaskListing" , new { id = item.TaskID }, new AjaxOptions (){ HttpMethod = "GET" , UpdateTargetId = "taskListing" , InsertionMode = InsertionMode.Replace }) And the controller method called by the Ajax ActionLink is decorated with Ajax attribute. [HttpGet] [AjaxOnly(true)] [ActionName("TaskListing")] public ActionResult TaskListing_Ajax ( int id = - 1 ) { var projects = projRep.GetAllProjects(); var model = new TaskAndTaskViewModel(); model.Task = te.Tasks.FirstOrDefault(t => t.TaskID == id); model.SelectList = from p in projRep.GetAllProjects() select new SelectListItem { Selected = (p.ProjectID == Convert.ToInt32(model.Task.ProjectID)), Text = p.ProjectName.ToString(), Value = p.ProjectID.ToString()

Hi, I was trying to load a JSON file located within my Visual Studio project using $.getJSON(), however the code below doesn't work as expected. $.getJSON( '/Assets/misc/employee.json' , function (data) { alert( 'processing!' ); }) .done( function (r) { alert(r.message); }) .fail( function (s) { alert( 'oops the file is missing!' ); }); After investigating for a few hours, I tested the local path of the JSON file such as http://localhost:3766/Assets/misc/employee.json and the result was an exception " HTTP Error 404.3 - Not Found The page you are requesting cannot be served because of the extension configuration. If the page is a script, add a handler. If the file should be downloaded, add a MIME map. ". I remember the solution in one of my ASP.NET project was to set the MimeMap in the web.config inside the system.webServer element. After setting the MimeMap for json files, I can now load local JSON files using $.getJSON(). <system.web

Hello, In an application wherein the controller is invoked using Ajax POST and that controller will redirect to a landing page such as Index after processing, an issue will occur such as the View of that landing page isn't updated or not refreshed. Normally, the View will be updated since the model is queried from the database. [HttpPost] public ActionResult Delete( int id) { try { Customer customer = _customer.Customers.FirstOrDefault(t => t.CustomerID == id); if (customer != null ) { _customer.Customers.Remove(customer); _customer.SaveChanges(); } } catch { //TODO } return RedirectToAction( "Index" ); } The fix for that is to change the RedirectToAction() statement to return the url of a landing page as JSON result. And in the ajax statement, add a statement that navigate to the url returned from the controller. [HttpPost] public ActionResult Delete( int id) { try { Customer customer = _customer.Customers.FirstOrDefault(t =>

Hi, When passing a url from a controller action to an Ajax $.post() result that is to navigate to the landing page, using the code below generates only a forward slash which is the root symbol instead of an absolute url. If the url value (/) will be used in window.location.href , it will cause an IIS page not found error. var url = new UrlHelper(Request.RequestContext).Action( "Index" , "Customer" ); return Json( new { Url = url }); So, to return the absolute url of the controller action in the current context, replace UrlHelper class with Url.Action() method. It is important to include the Request.Url.Scheme in the parameter to pass the correct protocol of the url. The code below will return an absolute url such as: http://localhost:7088 for the landing page. var url = this .Url.Action( "Index" , "Customer" , null , Request.Url.Scheme); return Json( new { Url = url });

Hello, Normally, you submit client-side data to a controller action via @Html.BeginForm(), then perform processing statements and lastly invoke the return View(); statement inside the controller action which will redirect you to the view which basically works. However, in a scenario where-in you will post data to a controller action using jQuery Control Event such as Button Click , the return View() statement in the controller action won't redirect to the specified view given the sample controller action below. [HttpPost] public ActionResult UpdatedEmpTrainings( string empId) { _context = new EmployeeEntities(); model = new List<EmployeeTrainingsViewModel>(); model = ( from emp_trainings in _context.EmployeeTrainings.AsEnumerable() join training in _context.Trainings.AsEnumerable() on emp_trainings.TrainingID equals training.TrainingID where emp_trainings.EmployeeID == Convert.ToInt32(empId) select new EmployeeTrainingsViewModel {

After testing the external js files in IE 8, the calls to post data to a controller does not work. After googling, I found a fix that is to set true to jquery support cors. jQuery Code: 1 jQuery.support.cors = true ; CORS, INTERNET EXPLORER 8, AND XDOMAINREQUEST Cheers!

In my previous post on loading items to Select control, I decided to create a more advanced example by rendering an asp.net mvc partial view using jquery based on drop down selection. The mvc application will simply load all orders irregardless of the status made by a particular customer selected from the dropdown list. The application also calculates the total orders made by the customer using jquery numberformatter framework. Partial View: @model IList <ShowWebGridUsingJQuery.Models.SalesOrderHeader> @{ Layout = Request.IsAjaxRequest() ? null : "~/Views/Shared/_Layout.cshtml"; } @{ var orderTotal = Model.Sum(o => (float)o.TotalDue); WebGrid grid = new WebGrid(Model); } <script type= "text/javascript" > $(document).ready(function () { var total = 0; $('#divGrid .totalDue').each(function () { total = total + parseFloat($(this)[0].innerHTML.toLocaleString().replace(",", &q

When integrating NumericUpDown Extender to your asp.net apps, there's a wide gap in between the up/down buttons as shown below: The trick to remove the extra space in between NumericUpDownExtender Default Buttons is to replace the doctype declaration in master page from: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> to: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> Note: This DTD contains all HTML elements and attributes, INCLUDING presentational and deprecated elements (like font) as described in w3. So, I believe there are presentational elements or deprecated elements incorporated into this extender. Reference: StackOverflow Cheers!

After adding an HTML Editor extender to my asp.net page, an error shows when rendering the page to the browser as stated which is the title of this post. I found the solution in asp.net forums which is to wrap aspx markup codes enclosed with <% %> using placeholder control. The code below is in my ASP.NET Master Page: <head runat= "server" > <title></title> <link href= "~/Styles/Site.css" rel= "stylesheet" type= "text/css" /> <asp:PlaceHolder Runat= "server" > <script src= '<%=Page.ResolveUrl("~/Scripts/jquery-1.4.1.min.js") %>' language= "javascript" type= "text/javascript" ></script> </asp:PlaceHolder> <asp:ContentPlaceHolder ID= "HeadContent" runat= "server" > </asp:ContentPlaceHolder> </head> Reference: Handling Ajax Extenders Error :)

When setting animations for AnimationExtender control using JSON/Javascript, setting the AnimationTarget with the explicit control id such as panel ID does not work when rendered to browser specified by the code below: "AnimationTarget" : "panelDescription" The workaround is to get the clientID of the panel control rendered through the browser. Below is the workaround code: //Note: this is just a fragment of the JSON animation //the actual animation might be a little bit specific than this. var animation = "AnimationTarget":"' + '<%= panelDescription.ClientID %>' + '","AnimationChildren"'; //set click behavior animationExtender.set_OnClick(animation); Cheers!

Good day! After integrating ajax accordion pane controls in my asp.net app, an exception pops up as stated by the title of the post. The culprit was that I initialized two AccordionPane objects w/o specifying the ID's of each object. The solution is to include ID's in each control.See example below: AccordionPane ap1 = new AccordionPane(); ap1.ID = "ap1" ; ap1.HeaderContainer.Controls.Add( new LiteralControl( "Product Code" )); ap1.ContentContainer.Controls.Add( new LiteralControl(datarow[ "ID" ].ToString();)); AccordionPane ap2 = new AccordionPane(); ap2.ID = "ap2" ; ap2.HeaderContainer.Controls.Add( new LiteralControl( "Product Name" )); ap2.ContentContainer.Controls.Add( new LiteralControl(datarow[ "Prod_Name" ].ToString();)) Cheers!

Hi! When running an asp.net app that includes an ajax custom extender control, a javascript alert pops up message "EXTENDER is undefined". Sample error message: CustomExtenders.DisabledTextBehavior is undefined where: CustomExtenders.DisabledTextBehavior is Namespace.Type After troubleshooting for several hours, I came up with the solution: 1. Download Ajax Toolkit Stable Release for the specific .NET Framework.  I tried versions for September release and it's not working. 2. Replace code: CustomExtenders.DisabledTextBehavior.registerClass( 'CustomExtenders.DisabledTextBehavior' , AjaxControlToolkit.BehaviorBase); To CustomExtenders.DisabledTextBehavior.registerClass( 'CustomExtenders.DisabledTextBehavior' , Sys.Extended.UI.BehaviorBase); Note: AjaxControlToolkit.BehaviorBase is used in previous versions of AjaxToolkit. Cheers!

Hello! The previous version of ExtenderControlBaseDesigner does not require T as parameter. However, in recent versions you might notice that the class is declared with T. Here's a sample declaration: AjaxControlToolkit.Design.ExtenderControlBaseDesigner<T> T means AjaxControlToolkit.ExtenderControlBase. In order for the Custom Extender Designer to work, supply the T with class that inherits the ExtenderControlBase. This sample class inherits the ExtenderControlBase: public class CustomPanelExtender : ExtenderControlBase { //your code goes here.... }

When adding ajax extenders to asp.net server controls using Smart Tag, you often encounter an issue such as Show Smart Tag is greyed out/disabled. The best thing to do is to use the latest stable version of AjaxToolkit. And then, reset the toolbox. Sometimes, you have to close the Visual Studio IDE just to make sure. IDE Version: Visual Studio 2010 Professional Ajax Toolkit Binary: AjaxControlToolkit.Binary.NET4 (Stable Version) Cheers!

1. First step is to add reference to the web service using Ajax Script Manager: <asp:ScriptManager ID= "ajaxManager" runat= "server" > <Services> <asp:ServiceReference Path= "~/Services/ProductService.asmx" /> </Services> </asp:ScriptManager> 2. Secondly is to include the namespace in calling the webservice method From ProductService.GetProducts( function (data) { $.each(data, function (index, elem) { $( "<option />" ) .text(elem.ProductName) .val(elem.ProductID) .appendTo( "#products" ); }); } ); To AccessingServerSideDataUsingClientScript.Services.ProductService.GetProducts( function (data) { $.each(data, function (index, elem) { $( "<option />" )

I was wondering why when I type PopupControlExtender. nothing happens. Supposedly, GetProxyForCurrentPopup method will show. The solution was so simple, I forgot to include the namespace of AjaxControlsToolkit. //add namespace AjaxToolkit using AjaxControlToolkit; //call commit method PopupControlExtender pce = PopupControlExtender.GetProxyForCurrentPopup( this ); pce.Commit( "hi" );

By default, the width of the autocomplete list of autocomplete extender is inherited from the target control which is the textbox. However, you can customize the width and appearance of the ajax control: 1. Create an asp.net website 2. Add a webservice to your site 3. In your webservice, add a code to retrieve customer or any info. 4. In your asp.net website, add an aspx markup similar below:  Note that CompletionListElementID target control is the div called autocomplete declared below the textbox. <asp:ToolkitScriptManager ID= "ToolkitScriptManager1" runat= "server" > <Services> <asp:ServiceReference Path= "~/YourSampleService.asmx" /> </Services> </asp:ToolkitScriptManager> <div> <table> <tr> <td><asp:TextBox ID= "txtName" runat= "server" ></asp:TextBox></td> <td><div id= "AutoComplete" runat= "server&q

I encountered a problem with jquery in asp.net ajax with master page content. During first pageload, the jquery script works fine, but after partial postback, the jquery script does not work. After a few googling activity, I came upon this site: http://encosia.com/2009/03/25/document-ready-and-pageload-are-not-the-same/ This explains how to use document.ready, pageload, and Application.init. In my previous code, i've used document.ready since my aspx page was not ajax enabled. But since, Im switching my application to ajax ready, the solution I came upon was using function pageLoad() instead of document.ready(). Example: 1 2 3 4 5 6 7 function Pageload() { $( "#txtsomething" ).blur( function () { //your js code here var x = 25 + 25 ; alert(x); }); } Hope this insight will help other developers out there... Here is the summary from the direct link: $(document).ready() Ideal for onetime initialization. Optimization black magic; may