2014-09-24 69 views
0

我在我的mvc項目中有一個dropdownlisfor。我將onchange事件添加到dropdownlistfor,但它不起作用。我不明白我犯了什麼錯誤。你可以幫我嗎?DropdownlistFor onchange事件不起作用

這裏是Dropdownlistfor:

<span id="span1"> 
      @{ 
       string birth_Date = null; 
       @Html.DropDownListFor(model => model.Birth_Date, 
     new SelectList((System.Collections.IEnumerable)DoctorDatawarehouse.Business.CommonChoiceList.LoadYearList(), "Value", "Text", birth_Date, new { onchange = "HideSecond()" })) 

      } 
       </span> 

那麼這裏就是觸發的onchange功能:

<script type="text/javascript"> 
    function HideSecond() 
    { 
     alert('deneme'); 
     document.getElementById("span2").style.visibility = "hidden"; 
    } 
</script> 

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width" /> 
    <title>Yeni Doktor Kaydı</title> 

    <link href="/Content/site.css" rel="stylesheet"/> 

    <script src="/Scripts/modernizr-2.6.2.js"></script> 


</head> 

<body> 
    <header> 
     <div class="content-wrapper"> 
      <div class="float-left"> 

       <nav> 
        <ul id="menu"> 
         <li><a href="/NewDoctor/Create">Yeni Doktor Kaydı</a></li> 
        </ul> 
       </nav> 
      </div> 
      <div class="float-right"> 
       <section id="login"> 


    <ul> 
     <li><a href="/Account/Create" id="registerLink">&#220;ye Olma</a></li> 
     <li><a href="/Account/Login" id="loginLink">Giriş</a></li> 
    </ul> 

       </section> 

      </div> 
     </div> 
    </header> 
    <div id="body"> 

     <section class="content-wrapper main-content clear-fix"> 


<h2>Doktor Bilgi Formu</h2> 





<script type="text/javascript"> 
    function HideSecond() { 
     alert('Tarih gizlendi.'); 
     document.getElementById("span2").style.visibility = "hidden"; 
    } 
    function HideFirst() { 
     alert('Tarih aralığı gizlendi.'); 
     document.getElementById("span1").style.visibility = "hidden"; 
    } 

</script> 

<form action="/NewDoctor/Create" method="post"><input name="__RequestVerificationToken" type="hidden" value="nZVU-_ynRW6zacl91y__lXRfmcKbisNZUgiOKr9FlM9AP71zCniulgUpk_yYPlkxmr_NNn576KAf-b5lEaVzg0YPD8AOH8DrVqV8x0ChAJo1" /> <fieldset> 
    <table> 


     <tr> 
      <td><label for="Name">Ad Soyad</label></td> 
      <td><div class="editor-field">* 
      <input class="text-box single-line" data-val="true" data-val-length="İsmi 3-50 karakter arasında girebilirsiniz." data-val-length-max="50" data-val-length-min="3" data-val-required="Lütfen isim giriniz!" id="Name" name="Name" type="text" value="" /> 
      <span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true"></span> 
     </div></td> 
     </tr> 

     <tr> 
      <td><label for="Birth_Date">Doğum Tarihi/Tahmini Yaş Aralığı</label></td> 
      <td><div class="editor-field">* 
       <span id="span1"> 
<select id="Birth_Date" name="Birth_Date"><option value=""></option> 
<option value="1900">1900</option> 
<option value="1901">1901</option> 
<option value="1902">1902</option> 
<option value="1903">1903</option> 
<option value="1904">1904</option> 
<option value="1905">1905</option> 
<option value="1906">1906</option> 
<option value="1907">1907</option> 
<option value="1908">1908</option> 
<option value="1909">1909</option> 
<option value="1910">1910</option> 
<option value="1911">1911</option> 
<option value="1912">1912</option> 
<option value="1913">1913</option> 
<option value="1914">1914</option> 
<option value="1915">1915</option> 
<option value="1916">1916</option> 
<option value="1917">1917</option> 
<option value="1918">1918</option> 
<option value="1919">1919</option> 
<option value="1920">1920</option> 
<option value="1921">1921</option> 
<option value="1922">1922</option> 
<option value="1923">1923</option> 
<option value="1924">1924</option> 
<option value="1925">1925</option> 
<option value="1926">1926</option> 
<option value="1927">1927</option> 
<option value="1928">1928</option> 
<option value="1929">1929</option> 
<option value="1930">1930</option> 
<option value="1931">1931</option> 
<option value="1932">1932</option> 
<option value="1933">1933</option> 
<option value="1934">1934</option> 
<option value="1935">1935</option> 
<option value="1936">1936</option> 
<option value="1937">1937</option> 
<option value="1938">1938</option> 
<option value="1939">1939</option> 
<option value="1940">1940</option> 
<option value="1941">1941</option> 
<option value="1942">1942</option> 
<option value="1943">1943</option> 
<option value="1944">1944</option> 
<option value="1945">1945</option> 
<option value="1946">1946</option> 
<option value="1947">1947</option> 
<option value="1948">1948</option> 
<option value="1949">1949</option> 
<option value="1950">1950</option> 
<option value="1951">1951</option> 
<option value="1952">1952</option> 
<option value="1953">1953</option> 
<option value="1954">1954</option> 
<option value="1955">1955</option> 
<option value="1956">1956</option> 
<option value="1957">1957</option> 
<option value="1958">1958</option> 
<option value="1959">1959</option> 
<option value="1960">1960</option> 
<option value="1961">1961</option> 
<option value="1962">1962</option> 
<option value="1963">1963</option> 
<option value="1964">1964</option> 
<option value="1965">1965</option> 
<option value="1966">1966</option> 
<option value="1967">1967</option> 
<option value="1968">1968</option> 
<option value="1969">1969</option> 
<option value="1970">1970</option> 
<option value="1971">1971</option> 
<option value="1972">1972</option> 
<option value="1973">1973</option> 
<option value="1974">1974</option> 
<option value="1975">1975</option> 
<option value="1976">1976</option> 
<option value="1977">1977</option> 
<option value="1978">1978</option> 
<option value="1979">1979</option> 
<option value="1980">1980</option> 
<option value="1981">1981</option> 
<option value="1982">1982</option> 
<option value="1983">1983</option> 
<option value="1984">1984</option> 
<option value="1985">1985</option> 
<option value="1986">1986</option> 
<option value="1987">1987</option> 
<option value="1988">1988</option> 
<option value="1989">1989</option> 
<option value="1990">1990</option> 
<option value="1991">1991</option> 
<option value="1992">1992</option> 
<option value="1993">1993</option> 
<option value="1994">1994</option> 
<option value="1995">1995</option> 
<option value="1996">1996</option> 
<option value="1997">1997</option> 
<option value="1998">1998</option> 
<option value="1999">1999</option> 
<option value="2000">2000</option> 
<option value="2001">2001</option> 
<option value="2002">2002</option> 
<option value="2003">2003</option> 
<option value="2004">2004</option> 
<option value="2005">2005</option> 
<option value="2006">2006</option> 
<option value="2007">2007</option> 
<option value="2008">2008</option> 
<option value="2009">2009</option> 
<option value="2010">2010</option> 
<option value="2011">2011</option> 
<option value="2012">2012</option> 
<option value="2013">2013</option> 
<option value="2014">2014</option> 
</select> 
       </span> 
       <span id="span2"> 
<select id="Town" name="Town"><option value=""></option> 
<option value="1989">20-30</option> 
<option value="1979">30-40</option> 
<option value="1969">40-50</option> 
<option value="1959">50-60</option> 
<option value="1949">60+</option> 
</select> 
       </span> 
      <span class="field-validation-valid" data-valmsg-for="Birth_Date" data-valmsg-replace="true"></span> 
     </div></td> 
     </tr> 

     <tr> 
      <td><label for="Gender">Cinsiyet</label></td> 
      <td><div class="editor-field">* 
<select data-val="true" data-val-required="Lütfen cinsiyet bilgisini giriniz!" id="Gender" name="Gender"><option value="K">Kadın</option> 
<option value="E">Erkek</option> 
</select> 
      <span class="field-validation-valid" data-valmsg-for="Gender" data-valmsg-replace="true"></span> 
     </div></td> 
     </tr> 

     <tr> 
      <td><label for="Country">İkamet Ettiği &#220;lke</label></td> 
      <td><div class="editor-field">* 
      <input class="text-box single-line" data-val="true" data-val-length="Ülke ismini 3-25 karakter arasında girebilirsiniz." data-val-length-max="25" data-val-length-min="3" data-val-required="Lütfen ülke bilgisini giriniz!" id="Country" name="Country" type="text" value="" /> 
      <span class="field-validation-valid" data-valmsg-for="Country" data-valmsg-replace="true"></span> 
     </div></td> 
     </tr> 

     <tr> 
      <td><label for="City">İkamet Ettiği İl</label></td> 
      <td><div class="editor-field">* 
<select id="City" name="City"><option value="01  ">Adana</option> 
<option value="02  ">Adıyaman</option> 
<option value="03  ">Afyon</option> 
<option value="04  ">Ağrı</option> 
<option value="05  ">Amasya</option> 
<option value="06  ">Ankara</option> 
<option value="07  ">Antalya</option> 
<option value="08  ">Artvin</option> 
<option value="09  ">Aydın</option> 
<option value="10  ">Balıkesir</option> 
<option value="11  ">Bilecik</option> 
<option value="12  ">Bing&#246;l</option> 
<option value="13  ">Bitlis</option> 
<option value="14  ">Bolu</option> 
<option value="15  ">Burdur</option> 
<option value="16  ">Bursa</option> 
<option value="17  ">&#199;anakkale</option> 
<option value="18  ">&#199;ankırı</option> 
<option value="19  ">&#199;orum</option> 
<option value="20  ">Denizli</option> 
<option value="21  ">Diyarbakır</option> 
<option value="22  ">Edirne</option> 
<option value="23  ">Elazığ</option> 
<option value="24  ">Erzincan</option> 
<option value="25  ">Erzurum</option> 
<option value="26  ">Eskişehir</option> 
<option value="27  ">Gaziantep</option> 
<option value="28  ">Giresun</option> 
<option value="29  ">G&#252;m&#252;şhane</option> 
<option value="30  ">Hakkari</option> 
<option value="31  ">Hatay</option> 
<option value="32  ">Isparta</option> 
<option value="33  ">Mersin</option> 
<option value="34  ">İstanbul</option> 
<option value="35  ">İzmir</option> 
<option value="36  ">Kars</option> 
<option value="37  ">Kastamonu</option> 
<option value="38  ">Kayseri</option> 
<option value="39  ">Kırklareli</option> 
<option value="40  ">Kırşehir</option> 
<option value="41  ">Kocaeli</option> 
<option value="42  ">Konya</option> 
<option value="43  ">K&#252;tahya</option> 
<option value="44  ">Malatya</option> 
<option value="45  ">Manisa</option> 
<option value="46  ">K.Maraş</option> 
<option value="47  ">Mardin</option> 
<option value="48  ">Muğla</option> 
<option value="49  ">Muş</option> 
<option value="50  ">Nevşehir</option> 
<option value="51  ">Niğde</option> 
<option value="52  ">Ordu</option> 
<option value="53  ">Rize</option> 
<option value="54  ">Sakarya</option> 
<option value="55  ">Samsun</option> 
<option value="56  ">Siirt</option> 
<option value="57  ">Sinop</option> 
<option value="58  ">Sivas</option> 
<option value="59  ">Tekirdağ</option> 
<option value="60  ">Tokat</option> 
<option value="61  ">Trabzon</option> 
<option value="62  ">Tunceli</option> 
<option value="63  ">Şanlıurfa</option> 
<option value="64  ">Uşak</option> 
<option value="65  ">Van</option> 
<option value="66  ">Yozgat</option> 
<option value="67  ">Zonguldak</option> 
<option value="68  ">Aksaray</option> 
<option value="69  ">Bayburt</option> 
<option value="70  ">Karaman</option> 
<option value="71  ">Kırıkkale</option> 
<option value="72  ">Batman</option> 
<option value="73  ">Şırnak</option> 
<option value="74  ">Bartın</option> 
<option value="75  ">Ardahan</option> 
<option value="76  ">Iğdır</option> 
<option value="77  ">Yalova</option> 
<option value="78  ">Karab&#252;k</option> 
<option value="79  ">Kilis</option> 
<option value="80  ">Osmaniye</option> 
<option value="81  ">D&#252;zce</option> 
<option value="99  ">Yurtdışı - Diğer</option> 
</select> 
      <span class="field-validation-valid" data-valmsg-for="City" data-valmsg-replace="true"></span> 
     </div></td> 
     </tr> 

     <tr> 
      <td><label for="Speciality">Uzmanlığı</label></td> 
      <td><div class="editor-field">* 
<select data-val="true" data-val-number="The field Uzmanlığı must be a number." data-val-required="Lütfen uzmanlık bilgisini giriniz!" id="Speciality" name="Speciality"><option value="1">G&#246;z Hastalıkları</option> 
<option value="2">Hematoloji</option> 
<option value="3">Acil Tıp</option> 
<option value="4">Ağız ve Diş Sağlığı</option> 
<option value="5">Aile Hekimliği</option> 
<option value="6">Anestezi ve Reanimasyon</option> 
<option value="7">Beslenme ve Diyetetik</option> 
<option value="8">Beyin ve Sinir Cerrahisi</option> 
<option value="9">Biyokimya</option> 
<option value="10">&#199;ocuk Cerrahisi</option> 
<option value="11">&#199;ocuk Sağlığı ve Hastalıkları</option> 
<option value="12">Dermatoloji</option> 
<option value="13">Enfeksiyon Hastalıkları</option> 
<option value="14">Fiziksel Tıp ve Rehabilitasyon</option> 
<option value="15">Genel Yoğun Bakım</option> 
<option value="16">Ortopedi ve Travmatoloji</option> 
<option value="17">G&#246;ğ&#252;s Cerrahisi</option> 
<option value="18">Plastik, Rekonstr&#252;ktif ve Estetik Cerrahi</option> 
<option value="19">Tıbbi Onkoloji</option> 
<option value="20">Kadın Hastalıkları ve Doğum</option> 
<option value="21">Genel Cerrahi</option> 
<option value="22">Kalp ve Damar Cerrahisi</option> 
<option value="23">Kardiyoloji</option> 
<option value="24">Pratisyen Hekimlik</option> 
<option value="25">N&#246;roloji</option> 
<option value="26">Kulak-Burun-Boğaz Hastalıkları</option> 
<option value="27">G&#246;ğ&#252;s Hastalıkları</option> 
<option value="28">N&#252;kleer Tıp</option> 
<option value="29">İ&#231; Hastalıkları</option> 
<option value="30">Psikoloji</option> 
<option value="31">Psikiyatri</option> 
<option value="32">Radyasyon Onkolojisi</option> 
<option value="33">Enfeksiyon Hastalıkları ve Klinik Mikrobiyoloji</option> 
<option value="34">Halk Sağlığı</option> 
<option value="35">Patoloji</option> 
<option value="36">Radyoloji</option> 
<option value="37">Tıbbi Genetik</option> 
<option value="38">T&#252;p Bebek (IVF)</option> 
<option value="39">&#220;roloji</option> 
</select> 
      <span class="field-validation-valid" data-valmsg-for="Speciality" data-valmsg-replace="true"></span> 
     </div></td> 
     </tr> 
     <tr> 
      <td><label for="Sub_Branch">Yan Dal Uzmanlığı</label></td> 
      <td><div class="editor-field">* 
<select data-val="true" data-val-number="The field Yan Dal Uzmanlığı must be a number." id="Sub_Branch" name="Sub_Branch"><option value="">Yok</option> 
<option value="1">Algoloji</option> 
<option value="2">Cerrahi Onkoloji</option> 
<option value="3">&#199;ocuk Acil</option> 
<option value="4">&#199;ocuk Endokrinolojisi ve Metabolizma Hastalıkları</option> 
<option value="5">&#199;ocuk Enfeksiyon Hastalıkları</option> 
<option value="6">&#199;ocuk Gastroenteroloji</option> 
<option value="7">&#199;ocuk Genetik Hastalıkları</option> 
<option value="8">&#199;ocuk G&#246;ğ&#252;s Hastalıkları</option> 
<option value="9">&#199;ocuk Hematolojisi ve Onkolojisi</option> 
<option value="10">&#199;ocuk İmm&#252;nolojisi ve Alerji Hastalıkları</option> 
<option value="11">&#199;ocuk Kalp ve Damar Cerrahisi</option> 
<option value="12">&#199;ocuk Kardiyolojisi</option> 
<option value="13">&#199;ocuk Nefrolojisi</option> 
<option value="14">&#199;ocuk N&#246;rolojisi</option> 
<option value="15">&#199;ocuk Romatolojisi</option> 
<option value="16">&#199;ocuk &#220;rolojisi</option> 
<option value="17">&#199;ocuk Yoğun Bakımı</option> 
<option value="18">El Cerrahisi</option> 
<option value="19">Endokrinoloji ve Metabolizma Hastalıkları</option> 
<option value="20">Gastroenteroloji</option> 
<option value="22">Geatri</option> 
<option value="23">Hematoloji</option> 
<option value="24">İmm&#252;noloji ve Alerji Hastalıkları</option> 
<option value="25">Jinekolojik Onkoloji </option> 
<option value="26">Nefroloji</option> 
<option value="27">Neonatoloji</option> 
<option value="28">Perinatoloji</option> 
<option value="29">Romatoloji</option> 
<option value="30">Temel İmm&#252;noloji</option> 
<option value="31">Tıbbi Parazitoloji</option> 
<option value="32">Tıbbi Viroloji</option> 
</select> 
      <span class="field-validation-valid" data-valmsg-for="Sub_Branch" data-valmsg-replace="true"></span> 
     </div></td> 
     </tr> 

     <tr> 
      <td><label for="Academic_Appellation">Akademik &#220;nvanı</label></td> 
      <td><div class="editor-field">* 
<select data-val="true" data-val-number="The field Akademik Ünvanı must be a number." data-val-required="Lütfen akademik ünvan bilgisini giriniz!" id="Academic_Appellation" name="Academic_Appellation"><option selected="selected" value="0">Yok</option> 
<option value="1">Yrd. Do&#231;</option> 
<option value="2">Do&#231;</option> 
<option value="3">Prof.</option> 
</select> 
      <span class="field-validation-valid" data-valmsg-for="Academic_Appellation" data-valmsg-replace="true"></span> 
     </div></td> 
     </tr> 



     <tr> 
      <td><label for="is_Special_Notes">&#214;zel Not</label></td> 
      <td> 
      <span class="editor-field">* 
<select data-val="true" data-val-number="The field Özel Not must be a number." data-val-required="The Özel Not field is required." id="is_Special_Notes" name="is_Special_Notes"><option value="1">Var</option> 
<option selected="selected" value="0">Yok</option> 
</select> 
     </span> 
       <span class="editor-field"> 
      <input class="text-box single-line" id="Special_Notes" name="Special_Notes" type="text" value="" /> 
      <span class="field-validation-valid" data-valmsg-for="Special_Notes" data-valmsg-replace="true"></span> 
     </span></td> 
     </tr> 

     <tr> 
      <td><label for="Communication">Hekime Nasıl Ulaşılacak</label></td> 
      <td><div class="editor-field">&nbsp 
      <input class="text-box single-line" id="Communication" name="Communication" type="text" value="" /> 
      <span class="field-validation-valid" data-valmsg-for="Communication" data-valmsg-replace="true"></span> 
     </div></td> 
     </tr> 

     <tr> 
      <td><label for="Person_Name">Formu Dolduranın Adı Soyadı</label></td> 
      <td><div class="editor-field">* 
<input class="text-box single-line" data-val="true" data-val-length="Adınızı 3-50 karakter arasında girebilirsiniz." data-val-length-max="50" data-val-length-min="3" data-val-required="Lütfen adınızı giriniz!" id="Person_Name" name="Person_Name" type="text" value="" />   <span class="field-validation-valid" data-valmsg-for="Person_Name" data-valmsg-replace="true"></span> 
     </div></td> 
     </tr> 

     <tr> 
      <td><label for="Person_Email">Formu Dolduranın E-posta Adresi</label></td> 
      <td><div class="editor-field">* 
<input class="text-box single-line" data-val="true" data-val-required="Lütfen e-posta adresinizi giriniz." id="Person_Email" name="Person_Email" type="email" value="" />   <span class="field-validation-valid" data-valmsg-for="Person_Email" data-valmsg-replace="true"></span> 
     </div></td> 
     </tr> 
     <tr> 
      <td></td> 
      <td> 
       * ile belirtilen alanlar için veri girişi zorunludur. 
      </td> 
     </tr> 

    </table> 


     <p><input type="submit" value="Kaydet" name="Kaydet" onclick="ShowHide()"></p> 

    </fieldset> 
</form> 
     </section> 
    </div> 

    <footer> 
     <div class="content-wrapper"> 
      <div class="float-left"> 
       <p>&copy; 2014 - MedicalPark</p> 
      </div> 
     </div> 
    </footer> 

    <script src="/Scripts/jquery-1.9.1.js"></script> 

    <script src="/Scripts/jquery.unobtrusive-ajax.js"></script> 

    <script src="/Scripts/jquery.unobtrusive-ajax.js"></script> 
<script src="/Scripts/jquery.validate.js"></script> 
<script src="/Scripts/jquery.validate.unobtrusive.js"></script> 


</body> 
</html> 
+0

嘗試更換onchange事件綁定到一個簡單的警報;平變化= 「警報( '你好');」。這是否工作? – krisdyson 2014-09-24 06:55:57

+0

我試過onchange =「alert('hello');」 ,但它不再工作。我想知道我是否在寫作上犯了錯誤? – Bilal 2014-09-24 07:06:30

+0

請發佈最終的HTML。即在瀏覽器中查看,查看源代碼並將該代碼複製並粘貼到您的問題中。謝謝 – krisdyson 2014-09-24 07:10:32

回答

0

你是把onchange HTML屬性在構造函數中對象的選擇列表的比較比把它放在適當的DropDownListFor方法中參數。 更換

@Html.DropDownListFor(model => model.Birth_Date, 
    new SelectList((System.Collections.IEnumerable)DoctorDatawarehouse.Business.CommonChoiceList.LoadYearList(), "Value", "Text", birth_Date, new { onchange = "HideSecond()" })) 

隨着

@Html.DropDownListFor(model => model.Birth_Date, 
new SelectList((System.Collections.IEnumerable)DoctorDatawarehouse.Business.CommonChoiceList.LoadYearList(), "Value", "Text", birth_Date), 
new { onchange = "HideSecond()" })