2016-04-01 11 views
1

私は全く新しいWeb開発者です。文書を読んで、グーグル・グーグルを読んだ後、私はこの質問について混乱したままになります。私はコントローラ、モデル、およびform.submit()を行うビューを持っています(フロントエンドコードは私のものではありません)。コントローラ上でフォームデータを取得するにはどうすればよいですか?以下のコードは何もしません(エラーも値もありません)。jQueryからASP.NETコントローラにフォームデータを取得するにはどうすればよいですか?

@{ 
    ViewBag.Title = "Wizard"; 
} 


<div class="row wrapper border-bottom white-bg page-heading"> 
    <div class="col-lg-10"> 
     <h2>Analysis Setup</h2> 

    </div> 
    <div class="col-lg-2"> 

    </div> 
</div> 
<div class="wrapper wrapper-content animated fadeInRight"> 

    <div class="row"> 
     <div class="col-lg-12"> 
      <div class="ibox"> 

       <div class="ibox-title"> 
        <h2>New</h2> 
        <div class="ibox-tools"> 
         <a class="collapse-link"> 
          <i class="fa fa-chevron-up"></i> 
         </a> 
         <a class="dropdown-toggle" data-toggle="dropdown" href="#"> 
          <i class="fa fa-wrench"></i> 
         </a> 
         <ul class="dropdown-menu dropdown-user"> 
          <li> 
           <a href="#">Config option 1</a> 
          </li> 
          <li> 
           <a href="#">Config option 2</a> 
          </li> 
         </ul> 
         <a class="close-link"> 
          <i class="fa fa-times"></i> 
         </a> 
        </div> 
       </div> 
       <div class="ibox-content"> 
        <h2> 
         General Information 
        </h2> 
        <p> 
          Get started by providing general details and inviting others to work with you 
        </p> 

        <form id="form" action="#" class="wizard-big"> 
         <h1>Initial</h1> 
         <fieldset> 
          <h2>Basics</h2> 
          <div class="row"> 
           <div class="col-lg-8"> 
            <div class="form-group"> 
             <label>Analysis Name *</label> 
             <input id="analysisName" name="analysis" type="text" class="form-control required" > 

            </div> 
            <div class="form-group"> 
             <label>Description *</label> 
            <div> @Html.TextArea("name", new { @class = "form-control required" })</div> 
            </div> 
            <div class="form-group"> 
             <label>Due date *</label> 
             <input id="date" name="date" type="date" class="form-control required"> 
            </div> 
           </div> 
           <div class="col-lg-4"> 
            <div class="text-center"> 
             <div style="margin-top: 20px"> 
              <i class="fa fa-sign-in" style="font-size: 180px;color: #e5e5e5 "></i> 
             </div> 
            </div> 
           </div> 
          </div> 


         </fieldset> 
         <h1>Collboration</h1> 
         <fieldset> 
          <h2>Invite Others</h2> 
          <p>Invite others to work with you by providing their email. We will get them set up in no time.</p> 
          <div class="row"> 
           <div class="col-lg-6"> 
            <div class="form-group"> 
             <label>Manual* </label> 
             <p>Enter the number of employees whose information you will be entering manually (no invitation)</p> 
             <input id="manualNumber" name="number" type="number" class="form-control required" > 
            </div> 

            <div class="form-group"> 
             <label>Invitation* </label> 

             <p>Enter the number of employees you will be inviting to enter their own data</p> 
             <input id="inviteNumber" name="number" type="number" class="form-control required"> 
            </div> 

            </div> 
          </div> 
         </fieldset> 



         <h1>Invite</h1> 
         <fieldset> 
          <h2>Invite Your Employees</h2> 
          <p>Now enter the name and email of the employees you chose to invite in the pervious step</p> 
          <div class="row"> 
           <div class="col-lg-6"> 
            <div class="form-group"> 
             <label>Name * </label> 
             <input name="employeeName" type="text" class="form-control required"> 
            </div> 

            <div class="form-group"> 
             <label>Email * </label> 

             <input name="email" type="email" class="form-control required email"> 
            </div> 
            <div><button type="button" onClick="nextInvite" class="btn btn-success">Next Invite</button></div> 
           </div> 
          </div> 
         </fieldset> 


         <h1>Finish</h1> 
         <fieldset> 
          <div class="row"> 
           <div class="col-lg-6"> 

            <div> 
            <h3>Would you like to create custom forms for your employees?</h3> 
             <label> 
              Yes<input id="yes" type="checkbox" class="checkbox"> 
             </label> 
            <label> 
             No 
             <input id="no" type="checkbox" class="checkbox"/> 
            </label> 

           </div> 

           </div> 
          </div> 
         </fieldset> 

        </form> 

       </div> 
      </div> 
     </div> 

    </div> 
</div> 

@section Styles { 
    @Styles.Render("~/Content/plugins/iCheck/iCheckStyles") 
    @Styles.Render("~/plugins/wizardStepsStyles") 
} 

@section Scripts { 
    @Scripts.Render("~/plugins/wizardSteps") 
    @Scripts.Render("~/plugins/iCheck") 
    @Scripts.Render("~/plugins/validate") 

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

      function nextInvite() { 
       var input1 = document.getElementById("employeeName"); 
       var input2 = document.getElementById("email"); 

       input1.value = " "; 
       input2.value = " "; 
       alert("shitttt!"); 
      }; 

      $("#wizard").steps(); 
      $("#form").steps({ 
       bodyTag: "fieldset", 
       onStepChanging: function (event, currentIndex, newIndex) { 
        // Always allow going backward even if the current step contains invalid fields! 
        if (currentIndex > newIndex) { 
         return true; 
        } 

        // Forbid suppressing "Warning" step if the user is to young 
        if (newIndex === 3 && Number($("#age").val()) < 18) { 
         return false; 
        } 

        var form = $(this); 

        // Clean up if user went backward before 
        if (currentIndex < newIndex) { 
         // To remove error styles 
         $(".body:eq(" + newIndex + ") label.error", form).remove(); 
         $(".body:eq(" + newIndex + ") .error", form).removeClass("error"); 
        } 

        // Disable validation on fields that are disabled or hidden. 
        form.validate().settings.ignore = ":disabled,:hidden"; 

        // Start validation; Prevent going forward if false 
        return form.valid(); 
       }, 

       onFinishing: function (event, currentIndex) { 
        var form = $(this); 

        // Disable validation on fields that are disabled. 
        // At this point it's recommended to do an overall check (mean ignoring only disabled fields) 
        form.validate().settings.ignore = ":disabled"; 

        // Start validation; Prevent form submission if false 
        return form.valid(); 
       }, 
       onFinished: function (event, currentIndex) { 
        var form = $(this); 

        // Submit form input 
        form.submit(); 
       } 
      }).validate({ 
       errorPlacement: function (error, element) { 
        element.before(error); 
       }, 
       rules: { 
        confirm: { 
         equalTo: "#password" 
        } 
       } 
      }); 

     }); 
    </script> 
} 

コントローラ

[HttpPost] 
    public ActionResult ManagerAnalysis(FormCollection collection) 
    { 
     AnalysisModel model = new AnalysisModel(); 

     model.analysisName = collection["analysisName"]; 
     model.description = collection["description"]; 
     model.dueDate = collection["dueDate"]; 
     model.inviteInfo = collection["inviteInfo"]; 
     model.manual = collection["manual"]; 
     model.custom = collection["custom"]; 

     return View(); 
    } 

ビューは、ビューは長いですが、残りは、私は考えていない、検証のものは、ここに

関連しているされており、モデル

namespace coach.Models 
{ 
    public class AnalysisModel 
    { 


     public string analysisName { get; set; } 
     public string description { get; set; } 
     public string dueDate { get; set; } 
     public string manual { get; set; } 
     public string inviteInfo { get; set; } 
     public string custom { get; set; } 
    } 
} 

私はいくつかのリソースを私に指摘することができます私は何かを見つけることができるかもしれないので、プログラミングに新しいです。ありがとう!

編集

実際に打たのコントローラーで別の方法:

//GET MangerView 
    public ActionResult ManagerAnalysis() { 
     Console.WriteLine("getting first controller"); 
     return View(); 

    } 
+0

:だからアクションではなく、以下のような"#"

何かの値@Url.Action("ManagerAnalysis","ControllerName")を持つべきです正しく縛られる。 'onFinished'とは何ですか?それはどこに呼ばれますか?そして、 'var form = $(this);'は実際にあなたのフォームです。そしてあなたはあなたのコントローラメソッドを打っていますか? –

+0

@StephenMuecke ..間違っていれば、 'view'権利でバインドした場合のみ' FormCollection'の代わりに 'model'を使うことができます。しかし、彼の見解を見ると、彼は 'model'に束縛していません... –

+0

@GuruprasadRao、コントロールの' name'属性がプロパティ名と一致するのでバインドされます。しかし、このコードのいずれか、特にビューについては何もMVCはありません:) –

答えて

1

あなたformdataを投稿するaction urlが不足しています。それがされます `公共のActionResult ManagerAnalysis(AnalysisModelモデル)へのあなたの方法を変更する`と - あなたは `MVCでFormCollection`を必要とするべきではありません

<form id="form" action="@Url.Action("ManagerAnalysis","ControllerName")" class="wizard-big">