2014-05-19 4 views
0

여기에서 소스가 손실되었습니다 ... ASP.net 영역으로 들어가는 예쁜 녹색 ... 그러나 지금까지 내 시간을 즐기고 있습니다.라디오 버튼 선택을 기반으로 데이터베이스에 양식 정보 제출

그러니이 함께 처음부터 시작하자 :

배경 : 나는 사용자 로그인 informtion와 ASP.net MVC5 응용 프로그램 작업입니다. 사용자는 계정을 만들고, 메시지를받는 등 중요한 요소가 있습니다. 중요한 요소는 사용자가 라디오 버튼, 텍스트 영역 등으로 구성된 조건부 HTML HTML 양식으로 정보를 제출할 수있는 양식이 사이트에 있다는 것입니다. 최종 목표는 사용자가 양식을 작성하여 제출하여 MySQL 데이터베이스에 제출하고 선택한 요소를 사용하여 관리자와 사용자에게 전자 메일을 보낸 다음 "Account Dashboard"영역에서 응답을 채우는 것입니다.

문제 :

  • 웹 프로젝트
  • 2D 디자인 프로젝트 : 나는 3 개 가지 시나리오에서 올 것이다 HTML 양식에 자신의 라디오 버튼 선택에 따라 사용자가 제출 정보를 얻기 위해 노력하고
  • 3D 설계 프로젝트
사용자가 "프로젝트 형식"양식 필드 대신 "그래픽"의 "웹"을 선택 그렇다면

, 그들은 "웹"과 관련된 값만 제출할 것입니다.

if (IsPost) && (RadioButton.projectType.Equals(Web)) 
{ 
    projectType = Request.Form["Web"]; 
    TypeOfWebsite = Request.Form["TypeOfWebsite"]; 
    DeviceExperience = Request.Form["DeviceExperience"]; 
} 
:이 작업을 수행하는 가장 좋은 방법에 확인되지 않는로 실행하고 문제 ... 여기

은 사용자가 데이터베이스에 제출 웹 프로젝트를 선택할 때에 내가 만드는 시작했습니다 코드입니다

<form method="post"> 
     <br /> 


     <div class="row"> 


      <label class="formquestion col-md-3">Project Name:</label> 
      <input class="col-md-9" type="text" placeholder="Enter project name..." /> 


     </div> 

     <div class="row"> 
      <label id="ProjectType" for="ProjectType" class="formquestion col-md-3">Project Type: </label> 
      <span class="col-md-8"> 

       <input id="Web" name="ProjectType" type="radio" value="@Request.Form["Web"] value=" web" /> 
       <label for="Web">Web</label> 

       <input id="Graphic" name="ProjectType" type="radio" value="Graphic" /> 
       <label for="Graphic">Graphic</label> 

      </span> 

     </div> 



     <div class="hidefield" id="WebProject"> 
      <div class="row"> 

       <label class="formquestion col-md-3">Type Of Website: </label> 


       <span class="col-md-8"> 

        <input id="WebApplication" name="TypeOfWebsite" type="radio" value="1" /> 
        <label class="Web Application" for="Web Application">Web Application*</label> 


        <input id="eCommerce" name="TypeOfWebsite" type="radio" /> 
        <label class="choice" for="eCommerce">eCommerce</label> 


        <input id="SocialNetwork" name="TypeOfWebsite" type="radio" /> 
        <label class="choice" for="SocialNetwork">Social Network</label> 


        <input id="Forum" name="TypeOfWebsite" type="radio" /> 
        <label class="choice" for="Forum">Forum</label> 


        <input id="PackageDesign" name="TypeOfWebsite" type="radio" /> 
        <label class="choice" for="PackageDesign">News/Article</label> 


        <input id="Interactive" name="TypeOfWebsite" type="radio" /> 
        <label class="choice" for="Interactive">Interactive</label> 


        <input id="InformationalPersonal" name="TypeOfWebsite" type="radio" /> 
        <label class="choice" for="InformationalPersonal">Informational/Personal</label> 


        <p>*Not exactly sure what a web application is? Well...think TurboTax, Zamzar, Mint, Online Banking Services, MailChimp and Google Docs. </p> 


       </span> 



      </div> 


      <div class="row"> 


       <label class="formquestion col-md-3" for="DeviceExperience">Device Experience: </label> 


       <span class="col-md-8"> 


        <input id="Desktop" name="DeviceExperience" type="radio" value="1" /> 
        <label for="Desktop">Desktop</label> 


        <input id="Tablet" name="DeviceExperience" type="radio" /> 
        <label for="Tablet">Tablet</label> 


        <input id="Mobile" name="DeviceExperience" type="radio" /> 
        <label for="Mobile">Mobile</label> 


        <input id="Responsive" name="DeviceExperience" type="radio" /> 
        <label for="Responsive">Responsive</label> 


       </span> 


      </div> 
     </div> 


     <div class="hidefield" id="GraphicDimensions"> 
      <div class="row"> 


       <label class="formquestion col-md-3">Design Dimensions: </label> 


       <span class="col-md-8"> 


        <input id="2D" name="Dimension" type="radio" value="2D" /> 
        <label class="choice" for="Web">2D</label> 


        <input id="3D" name="Dimension" type="radio" value="3D" /> 
        <label for="3D">3D</label> 


       </span> 


      </div> 
     </div> 


     <div class="hidefield" id="2DGraphicProject"> 
      <div class="row"> 

       <label class="formquestion col-md-3">Choose 2D Design: </label> 


       <span class="col-md-8"> 


        <input id="BusinessCard" name="2DDesign" type="radio" value="1" /> 
        <label class="BusinessCard" for="BusinessCard">Business Card</label> 


        <input id="Flyer" name="2DDesign" type="radio" /> 
        <label class="choice" for="Flyer">Flyer</label> 


        <input id="Poster" name="2DDesign" type="radio" /> 
        <label class="choice" for="Poster">Poster</label> 



        <input id="PrintAd" name="2DDesign" type="radio" /> 
        <label class="choice" for="PrintAd">Print Ad</label> 


        <input id="PackageDesign" name="2DDesign" type="radio" /> 
        <label class="choice" for="PackageDesign">Package Design (Food/Product/Media)</label> 


        <input id="Logo" name="Logo" type="radio" /> 
        <label class="choice" for="Logo">Logo</label> 


       </span> 


      </div> 
     </div> 

     <div class="hidefield" id="hide3DDesignExplaination"> 

      <div class="row"> 
       <label class="formquestion col-md-3" for="3DDesign">Explain this 3D Design project: </label> 
       <textarea id="3DDesignExplaination" name="3DDesignExplaination" class="textareaform"></textarea> 


      </div> 
     </div> 

     <div class="hidefield" id="ProjectObjective"> 

      <div class="row"> 
       <label class="formquestion col-md-3" for="Objective">Project Objective:</label> 
       <textarea id="ObjectiveExplaination" name="ObjectiveExplaination" class="textareaform" placeholder="What is this website's primary objective? Sell me on it!"></textarea> 
      </div> 
     </div> 

     <div class="hidefield" id="DesignCopy"> 
      <div class="row"> 
       <label class="formquestion col-md-3" for="DesignCopy">Design Copy </label> 
       <textarea id="DesignCopy" name="DesignCopy" class="textareaform" placeholder="Any messeging/text/info needed to be included?"></textarea> 
      </div> 
     </div> 



     <div class="hidefield" id="TargetAudience"> 
      <div class="row"> 
       <label class="formquestion col-md-3" for="TargetAudience">Describe Your Target Audience:</label> 
       <textarea id="TargetAudienceExplaination" name="TargetAudienceExplaination" class="textareaform" placeholder="Who is your target audience? What are their ages? What do they do for a living? Elaborate!"></textarea> 
      </div> 
     </div> 

     <div class="hidefield" id="Keywords"> 
      <div class="row"> 
       <label class="formquestion col-md-3">Keywords To Describe This Project:</label> 
       <input class="col-md-9" type="text" placeholder="Give me 3 keywords!"> 
      </div> 
     </div> 


     <div class="hidefield" id="FirstInteraction"> 
      <div class="row"> 
       <label class="formquestion col-md-3" for="UserFirstInteraction">User First Interaction:</label> 
       <textarea id="UserFirstInteraction" name="UserFirstInteraction" class="textareaform" placeholder="What Should The User Do First Upon Visiting The Website?"></textarea> 
      </div> 
     </div> 

     <div class="hidefield" id="General2"> 
      <div class="row"> 
       <label class="formquestion col-md-3" for="FavoriteColors">3 Favorite Colors?</label> 
       <input type="text" class="a-popup" data-color-format="hex" value="GreenYellow"> 
       <input type="text" class="a-popup" data-color-format="hex" value="GreenYellow"> 
       <input type="text" class="a-popup" data-color-format="hex" value="GreenYellow"> 
       <small>Hint: you can type in any CSS color (even named ones, like yellow).</small> 
       </p> 
      </div> 


      <div class="hidefield" id="Necessities"> 
       <div class="row"> 
        <label class="formquestion col-md-3" for="UserFirstInteraction">Necessities:</label> 
        <textarea id="DesignCopy" name="ProjectReason" class="textareaform" placeholder="What are necessities for this project? Specific graphic/sitefunctionalities?"></textarea> 
       </div> 
      </div> 

      <h5 class="bkgblack center-align col-md-11">Provide URL's of Site/Graphics (whatever is applicable) that design you admire</h5> 

      <div class="row"> 
       <label class="formquestion col-md-3" for="AdmireURL1">URL #1: </label> 
       <input id="AdmireURL1" name="AdmireURL1" type="text" maxlength="255" title="" value="http://" /> 
      </div> 

      <div class="row"> 
       <label class="formquestion col-md-3" for="AdmireURL2">URL #2: </label> 
       <input id="AdmireURL2" name="AdmireURL2" type="text" maxlength="255" title="" value="http://" /> 

      </div> 
      <div class="row"> 
       <label class="formquestion col-md-3" for="AdmireURL3">URL #3: </label> 
       <input id="AdmireURL3" name="AdmireURL3" type="text" maxlength="255" title="" value="http://" /> 
      </div> 


      <div class="hidefield" id="RivalURL"> 
       <h5 class="bkgblack center-align col-md-11">Provide URL's for "competitor" sites:</h5> 

       <div class="row"> 
        <label class="formquestion col-md-3" for="RivalURL1">Rival URL #1: </label> 
        <input id="RivalURL1" name="RivalURL1" type="text" maxlength="255" title="" value="http://" /> 
       </div> 

       <div class="row"> 
        <label class="formquestion col-md-3" for="RivalURL2">Rival URL #2: </label> 
        <input id="RivalURL2" name="RivalURL2" type="text" maxlength="255" title="" value="http://" /> 

       </div> 
       <div class="row"> 
        <label class="formquestion col-md-3" for="RivalURL3">Rival URL #3: </label> 
        <input id="RivalURL3" name="RivalURL3" type="text" maxlength="255" title="" value="http://" /> 
       </div> 
      </div> 
     </div> 

     <br /> 

     <div class="hidefield" id="ProjectReason"> 
      <div class="row"> 
       <label class="formquestion col-md-3" for="UserFirstInteraction">Project Reason:</label> 
       <textarea id="DesignCopy" name="ProjectReason" class="textareaform" placeholder="Why does your target audience NEED this project to exist?"></textarea> 
      </div> 
     </div> 



     <div class="row"> 
      <form action="file-upload.php" class="dropzone"></form> 

     </div> 


     <button type="submit" name="SubmitForm" class="btn btn-info btn-large">Submit Form</button> 

    </form> 

내가보고 된 다양한 MSDN 자습서

더 잘 이해하기 :

이 튜토리얼 내 양식이 필수 3 개 조건문을 만드는 방법에 나에게 분명히하지 않았 :

  • "사용자가 프로젝트 형식 선택한 경우 = "웹"과 양식을 제출, (양식 변수를 삽입) "
  • "사용자가 프로젝트 유형 = "그래픽"을 선택한 다음 치수 = "2D"를 선택하고 양식을 제출 한 경우 보내기 (상대 값 삽입) 데이터베이스 "
  • 0

      : 그래픽 "을 선택한 후 치수 ="3D "사용자가 프로젝트 형식 =를 선택한 경우"
    • 데이터베이스 "

    요약하자면"하고 양식을 제출, (상대 값을 삽입) 보내 "

  • 이를 수행하기위한 조건문을 작성하려면 어떻게해야합니까?
  • ASP 웹 페이지를 사용하는 HTML 양식 형식을 다시 고려해야합니까?

나는 각 필드의 "값"을 사용하여이 스키마를 따르는 사용자 선택에 따라 사용 가능한 양식 값을 표시하는 JavaScript를 작성했습니다. 의도 한대로 작동합니다! 이제는이 정보를 데이터베이스에 제출하는 방법에 관한 점을 연결하여 사용자 프로필에서 사용할 수 있습니다. 어떤 생각/대답이라도 크게 환영받을 것입니다!

답변

0

이것은 복잡한 형태입니다. 그러나 간단하게하기 위해 양식의 필드 수를 줄여 MVC 방식에 대한 아이디어를 제공합니다.

MVC를 최대한 활용하지 못했다는 점을 지적하면서 시작하겠습니다. 이것은 Model-View-Controller의 약자로 디자인 패턴입니다. 당신은 아마 그 물건을 알고 있지만, 당신의 코드에서 당신이 프로젝트에서 모델을 사용하고 있다는 것을 알 수있는 힌트가 보이지 않는다면 ... 할 필요는 없습니다. 그러나 MVC로 시작할 때부터해야합니다. 그래서,이 뷰 파일의 맨 첫 줄에 간다 ... 그럼 당신은 볼 것

public class ProjectTypeModel 
{ 
    public string Name { get; set; } 
} 

public class TestModel 
{ 
    public IList<ProjectTypeModel> Types { get; set; } 
} 

이 같은 모델을 선언 ... 다음과 같은 모델을 가지고

@model MvcTest.Models.TestModel 

을 가정 코드 단순화 된 형식은 다음과 같습니다.

@using(Html.BeginForm("ProcessTypes","Home")){ 
    <div class="row"> 
     <label class="formquestion col-md-3">Project Type: </label> 
     <span class="col-md-8"> 

      @foreach (var p in Model.Types) 
      { 
       <input id="@("radio_" + p.Name)" type="radio" name="SelectedProjectType" value="@p.Name" /> 
       <label for="@("radio_" + p.Name)">@p.Name</label> 
      } 

     </span> 

    </div> 

    <input type="submit" name="SubmitForm" class="btn btn-info btn-large" value="Submit Form" /> 
    } 

여기서 주목할 점은 라디오 버튼이 동일한 이름을 가져야한다는 것입니다. id는 관련성이 없으므로 고유 한 레이블을 지정하여 레이블 속성을 설정할 수 있습니다. 레이블을 클릭하면 라디오 버튼의 상태가 변경됩니다. , 분명히 ...

public ActionResult ProcessTypes(string SelectedProjectType) 
     { 

      //processing here... 
     } 

을 주목해야 할 마지막 일은 형태는 홈 컨트롤러의 "ProcessTypes"조치에 게시되어 있습니다 ...

및 홈 컨트롤러의 행동이 비슷한을 볼 것이다 SelectedProjectType에는 선택한 라디오 버튼 ... "웹"또는 "디자인"의 값이 표시됩니다.

매우 간단한 예제이지만 MVC (및 면도기)에서 어떻게 작동하는지 아이디어를 얻을 수 있습니다. 좀 더 커버 할 것이지만 당신이 스스로 알아낼 것이라고 확신합니다. 희망이 있으리라.

관련 문제