Sunday, November 16, 2014

MVC Razor Html Design Structure Sample with LIST,ADD,EDIT,VIEW,DELETE

@model ERPHotel.Models.UserLevelModel
@{
    ViewBag.Title = "UserLevel";
    Layout = "~/Views/Home/SiteMaster.cshtml";
}

<html>

<head>
    <meta name="viewport" content="width=device-width" />
    <title>User Level</title>
    @section Scripts
{
    @Html.Raw(ViewBag.message)
}

    <script type="text/javascript">

        var pageURL = window.document.URL;
        var virtualPath = "";@* @System.Configuration.ConfigurationManager.AppSettings["VirtualDirectory"].ToString();*@
        var url = pageURL.replace(location.pathname, virtualPath == "" ? "/Handlers/AutoComplete.ashx" : "/" + virtualPath + "Handlers/AutoComplete.ashx");

        $(document).ready(function () {
           
            InitComponents();          
            ShowHideAdvancedSearch();
        });

        function InitComponents() {
            ERPScriptUtils.MakeAutoCompleteDDL("txtuserlevel", url, "hdfuserlevel", true, true, "USERLEVELAUTO");
        }

        function ShowHideAdvancedSearch(flag) {
            //If flag then Show AdvancedSearch
            if (flag) {
                $("[id$=tbladvancedSearch]").show();
                $("[id$=imbShowFilter]").hide();
                $("[id$=imbHideFilter]").show();
            }
            else {
                $("[id$=tbladvancedSearch]").hide();
                $("[id$=imbShowFilter]").show();
                $("[id$=imbHideFilter]").hide();
            }
            return false;
        }

        function ShowListing(flag) {
            alert(flag);
            if (flag) {

                $("[id$=PageAction_List]").show();
                $("[id$=PageAction_Entry]").hide();
                $("[id$=pnlListing]").show();
                $("[id$=pnlEntry]").hide();
                $("[id$=ModifiedDatePnl]").hide();
            }
            else {

                $("[id$=PageAction_List]").hide();
                $("[id$=PageAction_Entry]").show();
                $("[id$=pnlListing]").hide();
                $("[id$=pnlEntry]").show();
            }
            return false;
        }
        function ValidateNow() {
            if (typeof (Page_ClientValidate) == 'function') {
                Page_ClientValidate();
            }
            if (!Page_IsValid) {
                $("[id$=litErrorMsg]").hide();
                ShowErrorMessage($("#diverror").html());
                return false;  //Page is invalid -- stop right here
            }
            else {
                //everythings ok --- Call your function & do your stuff
                return true;
            }
        }

        function ViewMode(mode) {
            //Mode = 1 Indicates its on View Mode
            //Mode = 2 Indicates its on New Mode
            if (mode == 1) {
                $("[id$=pnlSave]").hide();
                $("[id$=pnlDelete]").hide();
            }
            else if (mode == 2) {
                $("[id$=pnlDelete]").hide();
            }
        }
        function radioselect(_this) {         
            $("[id$=hdfid]").val("1");
            //$("[id$=btnEdit]").click();
            //ShowListing();
        }


    </script>
</head>

<body>
    @using (Html.BeginForm("UserLevel", "UserLevel", FormMethod.Post))
    {
        <div class="fixed-buttons">
            <div class="button_container">
                <table>
                    <tr>
                        @*SEC_ACTION is a dummy cssclass  FOR Accessing the Buttons in the Table Cell*@
                        <td id="SEC_ActionPanel" class="SEC_ACTION">
                            <ul class="bredcrum">
                                @Html.LabelFor(m => m.Breadcrumb)

                            </ul>
                            <ul id="pnlEntry" style="display: none">
                                <li runat="server" id="pnlSave">
                                    <input type="submit" name="Command" title="@Resources.Controls.Save" 
                                        value="@Resources.Controls.Save"  class="bttn_save" id ="btnSave" />
                                </li>
                                <li runat="server" id="pnlDelete">
                                    <input type="submit" name="Command" title="@Resources.Controls.Delete" 
                                        value="@Resources.Controls.Delete" onclick="ValidateNow()" class="bttn_delete" id ="btnDelete" />
                                </li>
                                <li>
                                    <input type="submit" name="Command" title="@Resources.Controls.Cancel" 
                                        value="@Resources.Controls.Cancel" onclick="ValidateNow()" class="bttn_cancel" id ="btnCancel" />
                                </li>
                            </ul>
                            <ul id="pnlListing" style="display: none">
                                <li>
                                    <input type="button" name="Command" title="@Resources.Controls.New" 
                                        value="@Resources.Controls.New" onclick="ShowListing()" class="bttn_new" id ="btnNew" />
                                </li>
                                <li>
                                    <input type="submit"  name="Command"  title="@Resources.Controls.Edit" 
                                        value="@Resources.Controls.Edit"  class="bttn_edit" id ="btnEdit" />
                                </li>
                                <li>
                                    <input type="submit" name="Command" title="@Resources.Controls.View" 
                                        value="@Resources.Controls.View" onclick="ValidateNow()" class="bttn_view" id ="btnView" />
                                </li>

                            </ul>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div id="horizontalTab">
            <ul class="resp-tabs-list">
                <li runat="server" id="lilist" class="resp-tab-active">
                    <a id="lnkList" tabindex="33" class="tab-active" href="javascript:__doPostBack(lnkList)"
                        style="font-family: Verdana; text-decoration: none;">@Resources.PageNameRes.List</a>
                </li>
                <li runat="server" id="lidetail">
                    <a id="lnkDetail" tabindex="33" class="tab-inactive" href="javascript:__doPostBack(lnkDetail)"
                        style="font-family: Verdana; text-decoration: none;">@Resources.PageNameRes.Detail</a>
                </li>
            </ul>

            <table id="tblTemplate" class="asptbllinks">
                <tr>
                    <td>
                        <table id="PageAction_List">
                            <tr>
                                <td>
                                    <div class="search-colapse">
                                        <table>
                                            <tr>
                                                <td>
                                                    <h1>@Resources.Controls.AdvanceSearch</h1>
                                                </td>
                                                <td>
                                                    <input type="image" name="imbShowFilter" id="imbShowFilter" tabindex="65"
                                                        title="Show Filter" src="~/Content/images/Classic/Icons/arrow-colapse-inactive.png"
                                                        onclick="javascript: return ShowHideAdvancedSearch(1);"
                                                        style="border-width: 0px;" />
                                                    <input type="image" name="imbHideFilter" id="imbHideFilter" tabindex="66"
                                                        title="Hide Filter" src="~/Content/images/Classic/Icons/arrow-colapse-active.png"
                                                        onclick="javascript: return ShowHideAdvancedSearch();"
                                                        style="border-width: 0px;" />
                                                </td>
                                            </tr>
                                        </table>
                                    </div>
                                    @*colpase btn*@
                                    <div class="clear">
                                    </div>
                                    <table class="table-devide advance-search" id="tbladvancedSearch" style="margin-top: 8px;">
                                        <tr id="Tr1">
                                            <td>
                                                <div class="div2col-S">
                                                    @Html.LabelFor(m => m.ugrp_name)
                                                    @Html.TextBoxFor(m => m.ugrp_name, new { id = "txtuserlevel" })
                                                    @Html.HiddenFor(m => m.ugrp_id, new { id = "hdfuserlevel" })
                                                    <div class="clear">
                                                    </div>
                                                </div>
                                            </td>
                                            <td>
                                                <div class="div2col-S">
                                                    <input type="submit" name="SEARCH" title="@Resources.Controls.Search" 
                                        value="@Resources.Controls.Search"  class="bttn_search" id ="btnSearch" />
                                                    <input type="submit" name="CLEAR" title="@Resources.Controls.Clear" 
                                        value="@Resources.Controls.Clear"  class="bttn_cancel" id ="btnClear" />

                                                </div>
                                            </td>
                                        </tr>
                                    </table>
                                    <div class="clear">
                                    </div>
                                    <div class="gridwrap">
                                        <table class="gridwrap" cellspacing="0" cellpadding="0" border="1" style="border-color: #D0D7E9; border-width: 1px; border-style: Solid; height: 10px; width: 100%; border-collapse: collapse;"
                                            id="grdUserLevel" rules="rows">
                                            <tbody>
                                                <tr class="grdhead" align="left" style="color: #506C92; border-width: 0px; font-family: Verdana; font-size: 10px; height: 25px;">
                                                    <th scope="col">&nbsp;
                                                    </th>
                                                    <th scope="col">
                                                        <a href="javascript:__doPostBack()" style="color: #506C92;">User Level</a>
                                                    </th>
                                                    <th scope="col">
                                                        <a href="javascript:__doPostBack()" style="color: #506C92;">Description</a>
                                                    </th>
                                                </tr>
                                                @if (ViewBag.UserLevelList!=null)
                                                {
                                                    foreach (System.Data.DataRow dr in ViewBag.UserLevelList.Rows)
                                                    {
                                                        <tr style="color: #263D62; background-color: White; border-color: #D0D7E9; border-width: 1px; border-style: Solid; font-family: Verdana; font-size: 11px; height: 10px;">
                                                            <td>
                                                                <input type="radio" name="SelectOne"                                                               
                                                                    id="@dr[@Resources.DataFieldRes.USERLEVELPK].ToString()"
                                                                    value="@dr[@Resources.DataFieldRes.USERLEVELPK].ToString()"
                                                                    onclick ="radioselect(@dr[Resources.DataFieldRes.USERLEVELPK].ToString())"
                                                                    />
                                                            </td>
                                                            <td>
                                                                @dr[@Resources.DataFieldRes.USERLEVEL].ToString()
                                                            </td>
                                                            <td>
                                                                @dr[@Resources.DataFieldRes.USERLEVELDESC].ToString()
                                                            </td>
                                                        </tr>
                                                    }
                                                }
                                            </tbody>
                                        </table>

                                    </div>
                                </td>
                            </tr>
                        </table>
                        <table id="PageAction_Entry">
                            <tr>
                                <td>
                                    <table class="table-devide">
                                        <tr>
                                            <td>
                                                <div class="div2col-S">
                                                    @Html.LabelFor(m => m.ugrp_descr)
                                                    @Html.TextBoxFor(m => m.ugrp_descr)
                                                    @Html.ValidationMessageFor(m => m.ugrp_descr)

                                                    <div class=" clear">
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <div class="div2col-S">
                                                    @Html.LabelFor(m => m.ugrp_desc)
                                                    @Html.TextBoxFor(m => m.ugrp_desc)
                                                    @Html.ValidationMessageFor(m => m.ugrp_desc)

                                                    <div class=" clear">
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <div class="div2col-S">
                                                    @Html.LabelFor(m => m.ugrp_admin)
                                                    @Html.CheckBoxFor(m => m.ugrp_admin)
                                                </div>
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
            @Html.HiddenFor(m => m.ugrp_id, new { id = "hdfid",value="0" })
            <div id="diverror" style="display: none">
                @*Use this label to bind the server errors*@

            </div>
        </div>
    }

</body>
</html>

No comments:

Using Authorization with Swagger in ASP.NET Core

 Create Solution like below LoginModel.cs using System.ComponentModel.DataAnnotations; namespace UsingAuthorizationWithSwagger.Models {     ...