Friday, 11 January 2013

Creating Asynchrous File Uploader in MVC3 with Kendo UI



Asynchronous Upload
View: UploadFile.cshtml
@using Kendo.Mvc.UI
@{
    ViewBag.Title = "UploadFile";
    //Layout = "~/Views/Shared/_PlainLayout.cshtml";
}

<h2>Upload File</h2>

<div style="width:45%">
    @(Html.Kendo().Upload()
          .Name("files")
          .Async(a => a
                          .Save("SaveFiles", "Upload")
                          .Remove("RemoveFiles", "Upload")
                          .AutoUpload(true)
          )
          )
</div>

<script type="text/javascript">
    $(document).ready(function () {
       
        $(".k-dropzone").css("height","100px");

    });
</script>
<script src="~/Scripts/kendo.all.min.js"></script>
<link href="~/Content/kendo.common.min.css" rel="stylesheet" />

Controller:
  public class UploadController : Controller
    {
        public ActionResult UploadFile()
        {
            return View();
        }

        public ActionResult SaveFiles(IEnumerable<HttpPostedFileBase> files)
        {
            if (files != null)
            {
                foreach (var file in files)
                {
                   
                    var fileName = Path.GetFileName(file.FileName);
                    var physicalPath = Path.Combine(Server.MapPath("~/Content/UploadFile"), fileName);

                    // Saving the File
                    file.SaveAs(physicalPath);
                }
            }

            // Return an empty string to signify success
            return Content("");
        }

        public ActionResult RemoveFiles(string[] fileNames)
        {
           if (fileNames != null)
            {
                foreach (var fullName in fileNames)
                {
                    var fileName = Path.GetFileName(fullName);
                    var physicalPath = Path.Combine(Server.MapPath("~/Content/UploadFile"), fileName);

                   

                    if (System.IO.File.Exists(physicalPath))
                    {
                        // Deleting the File from the Location
                         System.IO.File.Delete(physicalPath);
                    }
                }
            }
            return Content("");
        }
    }

Calling to the File Upload Control
$('#Searchwindow').kendoWindow({
        title: "Upload File",
        content: "/Upload/UploadFile",
        height: "400px",
        width: "600px",
        iframe: true,
        visible: false
    }).data('kendoWindow').center();
<div id="grid">
            <div id="Searchwindow"></div>
</div>

Error n(e.g. 8 or 12)Files has invalid value "<<<<<<< .mine". Illegal characters in path.

I got some peculiar error after taking the update of the solution  from SVN.
So in order to fix it i tried a lot of way but unable to find out the issue as it doesn't show the file where  .>>>>>>>>>>>>>>>>> mine or .<<<<<<<<<<<< mine exists. After a through review i find out that it is due to the different version of the files in the respective folder where .obj folder is there.


So, in order to fix this issue, just go to the respective folder and delete the version-ed file names or delete the old ones and rename the latest file to the original one.

The other approach is simply delete the /obj folder in each project that is complaining and re-compile.

This error is caused by the Subversion "Resolved..." function.

Enjoy !

Monday, 12 November 2012

Preventing the backbutton not to go to the previous URL when the control is in focus inside a textbox, textarea or radio button in any browser


While developing a website in Asp.net MVC4, I noticed that when my control is in focus inside a text-box or text-area, which are read only, it is moving to the parent of the current URL. In order to solve it i had written a JQuery below which will prevent the back to the parent URL in any browser and in any web developing programming languages.


    $(document).keydown(function(e) {
        var doPrevent;
        if (e.keyCode == 8) {
            var d = e.srcElement || e.target;
            if (d.tagName.toUpperCase() == 'INPUT' || d.tagName.toUpperCase() == 'TEXTAREA') {
                doPrevent = d.readOnly || d.disabled;
            }
            else
                doPrevent = true;
        }
        else
            doPrevent = false;

        if (doPrevent)
            e.preventDefault();
    });



Enjoy!..........

Monday, 5 November 2012

Issue with the sorting the telerik grid for Asp.net MVC

While working on telerik grid , I found a peculiar issue in Internet Explorer(IE) browsers. The issue is that on the column bound HeaderTemplate if you are providing a link for sorting purpose and if you used a label inside the link then the link will not work in IE but will work for all other browsers.


Solution: So, while providing the link text for sorting the grid on that column, just be care full that u must not used any label for that link. See below:

The code below will  not work:
column.Bound(m => m.Name).Template(
        @<text>
    <a target="_blank" href="@item.Url">@item.Name</a>
    </text>) .HeaderTemplate(
        @<text><a href="javascript:void(0)" class="t-link"> <label>Name<label> </a>  ---> This will not work
    </text>);



The code below will work:
 column.Bound(m => m.Name).Template(
        @<text>
    <a target="_blank" href="@item.Url">@item.Name</a>
    </text>) .HeaderTemplate(
        @<text><a href="javascript:void(0)" class="t-link"> Name </a>  ---> This will work.
    </text>);



Enjoy!.......

Friday, 2 November 2012

In MVC4 Telerik grid I got an error that telerik.textbox.js not found in the 'Script\telerik.textbox.js'

This is the tricky one, there is no problem in any where but it is throwing the problem because you might have passed some integer value to the column bound in the telerik grid in mvc3/mvc4.

There are two ways to fix it:

Method 1:

  Download the telerik.textbox.js and put in the specified location and it will work fine.

Note: Don't go for this method, since you are adding some more bytes to the  size of the Cod.

 Method 2:

 Just while binding the int value to the grid just convert it into a string. That's all, now your code will work fine



Enjoy!...