Wednesday, 16 January 2013

Set column editable mode based on another column value changes in kendo UI

View
@(Html.Kendo().Grid<MvcApplication1.Models.TestModels>()
        .Name("Grid")
        .Columns(columns =>
        {
            columns.Bound(p => p.ID);
            columns.Bound(p => p.Name);
            columns.Bound(p => p.IsActive);
            columns.ForeignKey(p => p.FID, (System.Collections.IEnumerable)ViewData["TestList"], "Value", "Text");

        })
        .ToolBar(toolBar => toolBar.Save())
        .Editable(editable => editable.Mode(GridEditMode.InCell))
        .Pageable()
        .Sortable()
        .Scrollable()
        .Filterable()
        .Events(e => e.Edit("onGridEdit"))
        .DataSource(dataSource => dataSource
            .Ajax()
            .Batch(true)
            .ServerOperation(false)
            .Events(events => events.Error("errorHandler"))
            .Model(model =>
            {
                model.Id(p => p.ID);
                model.Field(p => p.ID).Editable(false);
            })
        .Read(read => read.Action("ForeignKeyColumn_Read", "Home"))
        .Update(update => update.Action("ForeignKeyColumn_Update", "Home"))
        )
    )
Controller
namespace MvcApplication1.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {

            List<SelectListItem> items = new List<SelectListItem>();

            for (int i = 1; i < 6; i++)
            {
                SelectListItem item = new SelectListItem();
                item.Text = "text" + i.ToString();
                item.Value = i.ToString();
                items.Add(item);
            }

            ViewData["TestList"] = items;

            return View();
        }

        public ActionResult ForeignKeyColumn_Read([DataSourceRequest] DataSourceRequest request)
        {
            List<TestModels> models = new List<TestModels>();

            for (int i = 1; i < 6; i++)
            {
                TestModels model = new TestModels();
                model.ID = i;
                model.Name = "Name" + i;
                
                if (i % 2 == 0)
                {
                    model.IsActive = true;
                    model.FID = i;
                }

                models.Add(model);
            }

            return Json(models.ToDataSourceResult(request));
        }

        [AcceptVerbs(HttpVerbs.Post)]
        public ActionResult ForeignKeyColumn_Update([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<TestModels> tests)
        {
            if (tests != null && ModelState.IsValid)
            {
                // Save/Update logic comes here
            }

            return Json(ModelState.ToDataSourceResult());
        }
    }
} 
Model
namespace MvcApplication1.Models
{
    public class TestModels
    {
        public int ID { get; set; }
        public string Name { get; set; }
        public bool IsActive { get; set; }
        public int FID { get; set; }
    }
}
JS
<script type="text/javascript">

    function errorHandler(e) {
        if (e.errors) {
            var message = "Errors:\n";
            $.each(e.errors, function (key, value) {
                if ('errors' in value) {
                    $.each(value.errors, function () {
                        message += this + "\n";
                    });
                }
            });
            alert(message);
        }
    }

    function onGridEdit(arg) {
        if (arg.container.find("input[name=IsActive]").length > 0) {
            arg.container.find("input[name=IsActive]").click(function () {
                if ($(this).is(":checked") == false) {
                    arg.container.next().html("");
                    arg.model.FID = "0";
                }
                else {
                    arg.model.IsActive = true;
                    $("#Grid").data("kendoGrid").closeCell(arg.container);
                    $("#Grid").data("kendoGrid").editCell(arg.container.next());
                }
            });
        }
        if (arg.container.find("input[name=FID]").length > 0) {
            if (arg.model.IsActive == false) {
                $("#Grid").data("kendoGrid").closeCell(arg.container)
            }
        }
    }
</script>

DOWNLOAD DEMO

Monday, 24 December 2012

highlight the searched text in RadListBox and move checked items in to top of the list

JS
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
    <script type="text/javascript" language="javascript">
        function onChangeFilterByName(g, text) {
            var f = $find("<%= RadListBox1.ClientID %>");
            if (f._enableMarkMatches && ($telerik.isIE || $telerik.isChrome)) {
                var h = g.keyCode == Sys.UI.Key.backspace || g.keyCode == Sys.UI.Key.esc || g.keyCode == Sys.UI.Key.space || g.keyCode == Sys.UI.Key.down || g.keyCode == Sys.UI.Key.up;
                if (h) {
                    var j = f._onKeyPress(g);
                    g.preventDefault();
                    if (j) { return; }
                }
            }
            f._onKeyDown(g);
            f._onKeyPress(g);
        }
        function onChangeFilterByName1(txtFilterByName) {
            var check = 0;
            var listbox = $find("<%= RadListBox1.ClientID %>");
            var items = listbox.get_items();
            var itemContainsSearchText = new Array();
            var index = 0;
            {
                for (var i = 0; i <= items.get_count() - 1; i++) {
                    var item = items.getItem(i);
                    if (!item.get_checked() && item.get_text().toLowerCase().startsWith(txtFilterByName.value.toLowerCase())) {
                        item.scrollIntoView();
                        item.ensureVisible();
                        var text = item.get_text();
                        var replace = String.format("<span class=\"rlbHighlight\">{0}</span>", text);
                        item.set_text(replace);
                        //break;
                    }
                }
            }
        }

        function OnClientItemCheckedHandler(sender, eventArgs) {
            var item = eventArgs.get_item();
            var checkedItem = sender.get_checkedItems();
            checkedItem.sort(sortAscByText);
            var allItems = sender.get_items().toArray();
            for (var i = 0; i < checkedItem.length; i++) {
                sender.reorderItem(checkedItem[i], i);
            }

            if (!item.get_checked()) {
                //removed checked items
                for (var i = 0; i < checkedItem.length; i++) {
                    var index = allItems.indexOf(checkedItem[i]);
                    allItems.splice(index, 1);
                }
                //reorder uncheck items.
                allItems.sort(sortAscByText);
                var index = checkedItem.length;
                for (var i = 0; i < allItems.length; i++) {
                    sender.reorderItem(allItems[i], index);
                    index = index + 1;
                }
            }
        }

        function sortAscByText(a, b) {
            return a.get_text() == b.get_text() ? 0 : a.get_text() < b.get_text() ? -1 : 1
        }
    </script>
</telerik:RadCodeBlock>
ASPX
<div>
        <asp:TextBox ID="txtSort" runat="server" Width="195px" OnKeyUp="onChangeFilterByName(event,this)"></asp:TextBox><br />
        <br />
        <telerik:RadListBox ID="RadListBox1" runat="server" CheckBoxes="true" Width="200px"
            Height="200px" SelectionMode="Multiple" TabIndex="1" EnableMarkMatches="true"
            OnClientItemChecked="OnClientItemCheckedHandler">
            <Items>
                <telerik:RadListBoxItem Text="Argentina" Value="1"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="Australia" Value="2"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="Brazil" Value="3"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="Canada" Value="4"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="Chile" Value="5"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="China" Value="6"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="Egypt" Value="7"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="England" Value="8"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="France" Value="9"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="Germany" Value="10"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="India" Value="11"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="Indonesia" Value="12"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="Kenya" Value="13"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="Mexico" Value="14"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="New Zealand" Value="15"></telerik:RadListBoxItem>
                <telerik:RadListBoxItem Text="South Africa" Value="16"></telerik:RadListBoxItem>
            </Items>
        </telerik:RadListBox>
    </div>
Output of this code:


This code is contributed form Abidali Suthar [one of the developer in my team].

Wednesday, 5 December 2012

Apply MCTS (70-480) for Programming in HTML5 with JavaScript and CSS3 Exam At free of cost

I would like to announce for those entire eager professionals who want to appear / earn MCTS exam certification. By using promo code “HTMLJMP” or "HTMLMPN" in promatric center, you will be appear exam at free of cost (deduct $80 exam fee).



 


Moreover get reference of exam detail Please go through link,http://www.microsoft.com/learning/en/us/exam.aspx?id=70-480

For schedule an exam please go through this link : http://weblogs.asp.net/sreejukg/archive/2013/01/03/get-certified-for-free-microsoft-offers-free-certification-exam-70-480.aspx

Let me know if you need any further information.
 

 

Friday, 23 November 2012

DENSE_RANK(), RANK() and ROW_NUMBER()

CREATE TABLE #Department(DeptId int NOT NULL,DeptName nvarchar(max))
CREATE TABLE #Emp(EmpId int NOT NULL,DeptId int NOT NULL,EmpName nvarchar(max),Salary int)

INSERT INTO #Department (DeptId,DeptName) values(1,'D1')
INSERT INTO #Department (DeptId,DeptName) values(2,'D2')

INSERT INTO #Emp (EmpID,DeptId,EmpName,Salary) values(1,1,'A1',1000)
INSERT INTO #Emp (EmpID,DeptId,EmpName,Salary) values(2,1,'A2',2000)
INSERT INTO #Emp (EmpID,DeptId,EmpName,Salary) values(3,1,'A3',1000)
INSERT INTO #Emp (EmpID,DeptId,EmpName,Salary) values(4,2,'A4',1000)
INSERT INTO #Emp (EmpID,DeptId,EmpName,Salary) values(5,2,'A5',5000)

select dense_rank() over (partition by DeptId order by Salary) [dense_rank],
             rank() over (partition by DeptId order by Salary) [rank],
       row_number() over (partition by DeptId order by Salary) [row_number],
              DeptId,Salary
from #Emp;

Drop Table #Emp
Drop Table #Department
Output of above code:

Monday, 15 October 2012

Validate Upload control in KendoUI

.cshtml
<script type="text/javascript">

$(document).ready(function () {
   var validator = $("#ValidateDemoContainer").kendoValidator().data("kendoValidator");
       $("button").click(function (e) {
       //Validate Upload Control
       if ($("#UploadedFile").parent().siblings("ul").length > 0) {
               $("#UploadedFile").removeAttr("required");
       }
       //Validate Other control, which inside "ValidateDemoContainer"  
       if (!validator.validate()) {
               e.preventDefault();
            }
       });
});

</script>




 <div id="ValidateDemoContainer">
@using (Html.BeginForm("Method", "Controller", FormMethod.Post, new { id = "YourId", enctype = "multipart/form-data"}))
{
        @(Html.Kendo().Upload()
            .Name("UploadedFile")
            .Multiple(false)
            .HtmlAttributes(new { required = true })
        )
        <br />
        @Html.ValidationMessageFor(m => m.UploadedFile)
        <br />
        <button class="k-button" type="submit">Submit</button>
}
</div>
Model
public class YourModel
{
        [Required(ErrorMessage = "Please provide file")]
        public System.Web.HttpPostedFileBase UploadedFile { get; set; }
}