在C#cshtml中将单选按钮绑定到Angular

时间:2018-10-22 05:29:07

标签: c# angularjs asp.net-mvc

我想将单选按钮的值与 C#中的 ng-click 方法一起传递。我应该怎么做?我正在使用 JavaScript 将Resume的值绑定到 Modal 中。我想使用userAlertResumeSubmit函数发送ResumeId的值。

以下是我的模态代码:

<div class="modal fade" tabindex="-1" id="ResumeModal" role="dialog" ng-controller="topCtrl">
    <div class="modal-dialog modal-sm">
        <div class="modal-content ">
            @using (Html.BeginForm("ApplyJob", "PostedJob", FormMethod.Post))
            {
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">
                          x
                    </button>
                    <h4 class="modal-title">Choose Your Resume</h4>
                </div>
                <div class="modal-body">
                    <div class="row">

                        <div class="col-md-12">
                            <input type="hidden" name="PostedJobId" id="PostedJobById" value="@Model.PostedJobId" />
                            <input type="hidden" name="CreatedBy" id="CreatedBy" value="@Model.CreatedBy" />
                            @foreach (var item in NurseOneStop.WebSite.Models.ApplicationSession.CurrentUser.NurseResumeList)
                            {
                                <div class="col-md-12 lstCard">
                                    <input type="hidden" name="CheckedResumeId" id="CheckedResumeId" />
                                    <input type="radio" name="RBCheckedResume" style="height: 15px; width: 18px;" onchange="CheckedResume(@item.ResumeId)" /> <span>@item.ResumeName</span>
                                     </div>
                            }
                        </div>
                        @*<label id="lblMessage" style="color:red"></label>*@

                    </div>
                </div>
                <div class="modal-footer">
                <button id="btnSubmitResume" type="submit" class="btn btn-primary pull-right" ng-click="userAlertResumeSubmit()">
                        Submit
                </button>
                </div>
            }
        </div>
    </div>
</div>

这是将简历ID绑定到代码中的方式:

<script type="text/javascript">
    $(document).ready(function () {

        $("#btnShowModal").click(function (){
            $("#ResumeModal").modal('show');
        });
    });
    function CheckedResume(id) {
        $('#CheckedResumeId').val(id);
        //var IsAllow = ($('#CheckedResumeId').val());
        //alert('dddddddddddddddddddd' + IsAllow);
        console.log($('#CheckedResumeId').val());
    };
</script>

1 个答案:

答案 0 :(得分:0)

您的代码似乎更像是Jquery,而不是棱角分明的代码(不是一个好习惯)

因此无论如何,您的按钮中都有一个ng-click="userAlertResumeSubmit()" click方法,因此您可以像下面的javascript一样实现此方法

var userAlertResumeSubmit= function(){

    $.ajax({
        type: "POST",
        url: place your server url,
        data:pass the data",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(result){
           // if you want to do any action sin success then do it here 
        }
    });

}

注意:

如果您要坚持使用正确的AngularJS(推荐),请创建一个服务方法并从服务层调用服务器,然后在其中传递模型项。