Monday, January 3, 2022

Angular Get Post in MVC

Angular Js or 1 : Get Post Request

1. Model


public class admin_support_model
{
    public int? id { get; set; }
    public string name { get; set; }
    public string ed_code { get; set; }
    public string email { get; set; }
    public string phone { get; set; }
    public string remark { get; set; }

}
public class education
{
    public string ed_code { get; set; }
    public string ed_name { get; set; }
}
public class admin_news_letter_model
{
    public int? id { get; set; }
    public string email { get; set; }
    public Nullable<DateTime> edate { get; set; }
}

2. Views


@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>

    <script src="/Scripts2/jquery-3.3.1.min.js"></script>
    <script src="/Scripts2/angular.js"></script>
    <script src="/AngularCtrls/CommonFiles/myApp.js"></script>
</head>
<body  ng-app="MyApp">
    <script src="~/AngularCtrls/Admin/supportToAdminCtrl.js"></script>
    <div  ng-controller="supportToAdminCtrl">
        <form id="contact" ng-submit="af_SupportPost();" autocomplete="off">
            <div class="heading-title left">
                <small class="iq-font-green">Support With Us</small>
                <h2 class="title iq-tw-6">Support</h2>

            </div>
            <div class="contact-form">
                <div class="section-field">
                    <br />
                    <input class="require" id="cname" type="text" ng-model="p.name" placeholder="Name*" name="cname" required>
                </div>
                <div class="section-field">
                    Education
                    <select  id="ed_code" name="ed_code" ng-model="p.ed_code" required>
                        <option>
                        </option>
                        <option ng-repeat="m in educationList" value="{{m.ed_code}}" style="width:100px;">
                            {{m.ed_name}}
                        </option>
                        <input type="search" id="ed_name" ng-model="p.ed_name" ng-change="af_Education_List()" style="width:40px;"  />
                    </select>
                </div>
                <div class="section-field">
                    <input class="require" id="cemail" type="email" ng-model="p.email" placeholder="Email*" name="cemail" required>
                </div>
                <div class="section-field">
                    <input class="require" id="cphone" type="number" ng-model="p.phone" placeholder="Phone*" name="cphone" required>
                </div>
                <div class="section-field textarea">
                    <textarea id="cmessage" class="input-message require" ng-model="p.remark" placeholder="Comment*" rows="5" name="cmessage" required></textarea>
                </div>
                <div class="d-block text-center">
                    <button id="btnsupport" type="submit" value="Send" class="button iq-mt-15">Send Message</button>
                </div>
            </div>
        </form>


        <form id="contact" ng-submit="af_WeeklyNews()" autocomplete="off">
            <div class="heading-title text-center">
                <h2 class="title iq-tw-6" style="margin-bottom: 15px;">
                    Weekly newsletter
                </h2>
            </div>

            <div class="contact-form">
                <div class="row">
                    <div class="col-md-12">
                        <div class="section-field">
                            <input class="require" id="contact_email" type="email" ng-model="p.email" placeholder="Email*" name="contact_email" required>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-4">
                        <div class="d-block text-center">
                            <input id="Subscribesubmit" name="submit" type="submit" value="Subscribe" class="button" />
                        </div>
                    </div>
                </div>
            </div>            
        </form>
        <br />
        <table>
            <tr>
                <th>Srno</th>
                <th>Name</th>
                <th>Mobile</th>
                <th>Email</th>                
            </tr>
            <tr ng-repeat="m in supportList">                
                <td>{{m.id}}</td>
                <td>{{m.name}}</td>
                <td>{{m.phone}}</td>
                <td>{{m.email}}</td>                
            </tr>
        </table>

    </div>
</body>
</html>


    JsDownload Link

    https://drive.google.com/file/d/1cRFTMjag3x_fFTRPdPKoArRwDnzHo89z/view?usp=sharing

3. MVC Controller

public class HomeController : Controller
{
    // GET: Home
        public ActionResult Index()
        {
            return View();
        }
        string sql = "";    
        public ActionResult WeeklyNews(admin_news_letter_model d)
        {
            msg msg = new msg() { message = "News Letter Success submitted.", priority = "success", title = "Message" };            
            return Json(new { msg = msg }, JsonRequestBehavior.AllowGet);
        }
        public ActionResult SupportPost(admin_support_model d)
        {
            msg msg = new msg() { message = "Your Query Successfully submitted.", priority = "success", title = "Message" };            
            return Json(new { msg = msg }, JsonRequestBehavior.AllowGet);
        }
        public ActionResult SupportList(admin_support_model d)
        {
            admin_support_model_mvv mvv = new admin_support_model_mvv();

            msg msg = new msg() { message = "Your Query Successfully submitted.", priority = "success", title = "Message" };
            mvv.msgs = msg;

            List<admin_support_model> list = new List<admin_support_model>();
            list.Add(new admin_support_model { id = 1, name = "Rinkesh Gola", phone = "789475897", email = "abc@gmail.com", remark = "aass" });
            list.Add(new admin_support_model { id = 2, name = "Ramesh Sing", phone = "7894712345", email = "abc2@gmail.com", remark = "aass" });
            list.Add(new admin_support_model { id = 3, name = "Ajay Saagar", phone = "789476789", email = "abc3@gmail.com", remark = "aass" });
            list.Add(new admin_support_model { id = 4, name = "Manoj AAAA", phone = "7894711111", email = "abc32@gmail.com", remark = "aass" });
            list.Add(new admin_support_model { id = 5, name = "Sanjay Sharma", phone = "7894744444", email = "abca@gmail.com", remark = "aass" });

            mvv.admin_support_models_list = list;

            return Json(new { modelData = mvv }, JsonRequestBehavior.AllowGet);
        }
        public ActionResult ed_code_list(education d)
        {
            List<education> list = new List<education>();
            list.Add(new education { ed_code = "ED01", ed_name = "Illiterate " });
            list.Add(new education { ed_code = "ED02", ed_name = "Hight School" });
            list.Add(new education { ed_code = "ED03", ed_name = "Intermedeate" });
            list.Add(new education { ed_code = "ED03", ed_name = "Bachelor Degree" });
            list.Add(new education { ed_code = "ED05", ed_name = "Post Graduate" });

            var list2 = (from x in list
                         where (d.ed_name == null || x.ed_name.Contains(d.ed_name))
                         select x).ToList();

            return Json(new { list_data = list2 }, JsonRequestBehavior.AllowGet);
        }       

}


No comments:

Post a Comment

Linq Expression syntax for where condtion in linq

(Expression<Func<T, bool>> filter)