0

ここで、このメソッドを使用してカスタム DropDownList を作成しようとしました。

http://blog.platformular.com/2011/12/16/country-drop-down-html-helper-for-asp-net-mvc/

基本的に、ヘルパーは Html ファイルをロードし、ファイルで見つかった情報に基づいてドロップダウン リストに入力します。

しかし、ドロップダウン リストを作成するのではなく、私のアプリは次のようにビューにすべてのデータを表示します。

Country: <select name="countryCode" id="countryCode"><option value="">Please select</option><option value="AF"
>Afghanistan</option><option value="AL" >Albania</option><option value="DZ" >Algeria</option><option value="AS" >American Samoa</option><option value="AD" >Andorra</option><option value="AO"
>Angola</option><option value="AI" >Anguilla</option><option value="AQ" >Antarctica</option><option value="AG" >Antigua And Barbuda</option><option value="AR" >Argentina</option><option value="AM" >Armenia</option><option value="AW" >Aruba</option><option value="AU" >Australia</option><option value="AT"
>Austria</option><option value="AZ" >Azerbaijan</option><option value="BS" >Bahamas</option><option value="BH"
>Bahrain</option><option value="BD" >Bangladesh</option><option value="BB" >Barbados</option><option value="BY"
>Belarus</option><option value="BE" >Belgium</option><option value="BZ" >Belize</option><option value="BJ" >Benin</option><option value="BM" >Bermuda</option><option value="BT" >Bhutan</option><option value="BO" >Bolivia</option><option value="BA" >Bosnia And Herzegovina</option><option value="BW" >Botswana</option><option value="BV" >Bouvet Island</option><option value="BR"
>Brazil</option><option value="IO" >British Indian Ocean Territory</option><option value="BN" >Brunei Darussalam</option><option value="BG" >Bulgaria</option><option value="BF" >Burkina Faso</option><option value="BI"
>Burundi</option><option value="KH" >Cambodia</option><option value="CM" >Cameroon</option><option value="CA"
>Canada</option><option value="CV" >Cape Verde</option><option value="KY" >Cayman Islands</option><option value="CF" >Central African Republic</option><option value="TD" >Chad</option><option value="CL"
>Chile</option><option value="CN" >China</option><option value="CX" >Christmas Island</option><option value="CC" >Cocos (Keeling) Islands</option><option value="CO" >Colombia</option><option value="KM" >Comoros</option><option value="CG" >Congo</option><option value="CK" >Cook Islands</option><option value="CR" >Costa Rica</option><option value="CI" >Cote D'Ivoire</option><option value="HR" >Croatia (Local Name: Hrvatska)</option><option value="CU"
>Cuba</option><option value="CY" >Cyprus</option><option value="CZ" >Czech Republic</option><option value="DK" >Denmark</option><option value="DJ" >Djibouti</option><option value="DM"
>Dominica</option><option value="DO" >Dominican Republic</option><option value="EC" >Ecuador</option><option value="EG" >Egypt</option><option value="SV" >El Salvador</option><option value="GQ" >Equatorial Guinea</option><option value="ER" >Eritrea</option><option value="EE"
>Estonia</option><option value="ET" >Ethiopia</option><option value="FK" >Falkland Islands (Malvinas)</option><option value="FO"
>Faroe Islands</option><option value="FJ" >Fiji</option><option value="FI" >Finland</option><option value="FR" >France</option><option value="FX" >France, Metropolitan</option><option value="GF" >French Guiana</option><option value="PF" >French Polynesia</option><option value="TF" >French Southern Territories</option><option value="GA"
>Gabon</option><option value="GM" >Gambia</option><option value="GE" >Georgia</option><option value="DE" >Germany</option><option value="GH" >Ghana</option><option value="GI"
>Gibraltar</option><option value="GR" >Greece</option><option value="GL" >Greenland</option><option value="GD"
>Grenada</option><option value="GP" >Guadeloupe</option><option value="GU" >Guam</option><option value="GT" >Guatemala</option><option value="GN" >Guinea</option><option value="GW"
>Guinea-Bissau</option><option value="GY" >Guyana</option><option value="HT" >Haiti</option><option value="HM" >Heard Island & Mcdonald Islands</option><option value="HN" >Honduras</option><option value="HK" >Hong Kong</option><option value="HU"
>Hungary</option><option value="IS" >Iceland</option><option value="IN" >India</option><option value="ID"
>Indonesia</option><option value="IR" >Iran, Islamic Republic Of</option><option value="IQ" >Iraq</option><option value="IE"
>Ireland</option><option value="IL" >Israel</option><option value="IT" >Italy</option><option value="JM" >Jamaica</option><option value="JP" >Japan</option><option value="JO" >Jordan</option><option value="KZ" >Kazakhstan</option><option value="KE" >Kenya</option><option value="KI" >Kiribati</option><option value="KP" >Korea, Democratic People'S Republic Of</option><option value="KR" >Korea, Republic Of</option><option value="KW" >Kuwait</option><option value="KG"
>Kyrgyzstan</option><option value="LA" >Lao People'S Democratic Republic</option><option value="LV" >Latvia</option><option value="LB"
>Lebanon</option><option value="LS" >Lesotho</option><option value="LR" >Liberia</option><option value="LY" >Libyan Arab Jamahiriya</option><option value="LI" >Liechtenstein</option><option value="LT" >Lithuania</option><option value="LU"
>Luxembourg</option><option value="MO" >Macau</option><option value="MK" >Macedonia, The Former Yugoslav Republic Of</option><option value="MG" >Madagascar</option><option value="MW"
>Malawi</option><option value="MY" >Malaysia</option><option value="MV" >Maldives</option><option value="ML" >Mali</option><option value="MT" >Malta</option><option value="MH" >Marshall Islands</option><option value="MQ" >Martinique</option><option value="MR" >Mauritania</option><option value="MU"
>Mauritius</option><option value="YT" >Mayotte</option><option value="MX" >Mexico</option><option value="FM" >Micronesia, Federated States Of</option><option value="MD" >Moldova, Republic Of</option><option value="MC" >Monaco</option><option value="MN"
>Mongolia</option><option value="MS" >Montserrat</option><option value="MA" >Morocco</option><option value="MZ"
>Mozambique</option><option value="MM" >Myanmar</option><option value="NA" >Namibia</option><option value="NR" >Nauru</option><option value="NP" >Nepal</option><option value="NL"
>Netherlands</option><option value="AN" >Netherlands Antilles</option><option value="NC" >New Caledonia</option><option value="NZ" >New Zealand</option><option value="NI"
>Nicaragua</option><option value="NE" >Niger</option><option value="NG" >Nigeria</option><option value="NU" >Niue</option><option value="NF" >Norfolk Island</option><option value="MP" >Northern Mariana Islands</option><option value="NO" >Norway</option><option value="OM" >Oman</option><option value="PK" >Pakistan</option><option value="PW" >Palau</option><option value="PA" >Panama</option><option value="PG" >Papua New Guinea</option><option value="PY"
>Paraguay</option><option value="PE" >Peru</option><option value="PH" >Philippines</option><option value="PN" >Pitcairn</option><option value="PL" >Poland</option><option value="PT"
>Portugal</option><option value="PR" >Puerto Rico</option><option value="QA" >Qatar</option><option value="RE" >Reunion</option><option value="RO" >Romania</option><option value="RU" >Russian Federation</option><option value="RW" >Rwanda</option><option value="SH" >Saint Helena</option><option value="KN" >Saint Kitts And Nevis</option><option value="LC" >Saint Lucia</option><option value="PM" >Saint Pierre And Miquelon</option><option value="VC"
>Saint Vincent And The Grenadines</option><option value="WS" >Samoa</option><option value="SM" >San Marino</option><option value="ST" >Sao Tome And Principe</option><option value="SA" >Saudi Arabia</option><option value="SN" >Senegal</option><option value="SC"
>Seychelles</option><option value="SL" >Sierra Leone</option><option value="SG" >Singapore</option><option value="SK" >Slovakia (Slovak Republic)</option><option value="SI" >Slovenia</option><option value="SB" >Solomon Islands</option><option value="SO"
>Somalia</option><option value="ZA" >South Africa</option><option value="ES" >Spain</option><option value="LK" >Sri Lanka</option><option value="SD" >Sudan</option><option value="SR"
>Suriname</option><option value="SJ" >Svalbard And Jan Mayen Islands</option><option value="SZ" >Swaziland</option><option value="SE" >Sweden</option><option value="CH"
>Switzerland</option><option value="SY" >Syrian Arab Republic</option><option value="TW" >Taiwan</option><option value="TJ"
>Tajikistan</option><option value="TZ" >Tanzania, United Republic Of</option><option value="TH" >Thailand</option><option value="TG"
>Togo</option><option value="TK" >Tokelau</option><option value="TO" >Tonga</option><option value="TT" >Trinidad And Tobago</option><option value="TN" >Tunisia</option><option value="TR" >Turkey</option><option value="TM" >Turkmenistan</option><option value="TC" >Turks And Caicos Islands</option><option value="TV" >Tuvalu</option><option value="UG"
>Uganda</option><option value="UA" >Ukraine</option><option value="AE" >United Arab Emirates</option><option value="GB" >United Kingdom</option><option value="US" >United States</option><option value="UM" >United States Minor Outlying Islands</option><option value="UY" >Uruguay</option><option value="UZ"
>Uzbekistan</option><option value="VU" >Vanuatu</option><option value="VA" >Vatican City State (Holy See)</option><option value="VE"
>Venezuela</option><option value="VN" >Viet Nam</option><option value="VG" >Virgin Islands (British)</option><option value="VI"
>Virgin Islands (U.S.)</option><option value="WF" >Wallis And Futuna Islands</option><option value="EH" >Western Sahara</option><option value="YE" >Yemen</option><option value="YU"
>Yugoslavia</option><option value="ZR" >Zaire</option><option value="ZM" >Zambia</option><option value="ZW"
>Zimbabwe</option></select>

今コーディングした htmlHelper メソッドは次のとおりです。

public static class ExtensionMethods
{
    public static string CountryDropDown(this System.Web.Mvc.HtmlHelper helper, string name, string optionLabel, object selectedValue)
    {
        XmlDocument doc = new XmlDocument();
        doc.Load(HttpContext.Current.Server.MapPath("~/App_Data/countries.xml"));

        StringBuilder b = new StringBuilder();

        b.Append(string.Format("<select name=\"{0}\" id=\"{0}\">", name));
        if (!string.IsNullOrEmpty(optionLabel))
        {
            b.Append(string.Format("<option value=\"\">{0}</option>", optionLabel));
        }

        foreach (XmlNode node in doc.SelectNodes("//country"))
        {
           string selected = string.Empty;
           if (node.Attributes["code"].Value == selectedValue as string)
           {
               selected = "selected=\"selected\"";
           }
           b.Append(string.Format("<option value=\"{0}\" {2}>{1}</option>", node.Attributes["code"].Value, node.InnerText, selected));
        }
        b.Append("</select>");

        return b.ToString();
    }
}

そして、これらの名前空間を web.config に追加しました。

<namespaces>
    <add namespace="System.Web.Helpers" />
    <add namespace="System.Web.Mvc" />
    <add namespace="System.Web.Mvc.Ajax" />
    <add namespace="System.Web.Mvc.Html" />
    <add namespace="System.Web.Optimization" />
    <add namespace="System.Web.Routing" />
    <add namespace="System.Web.WebPages" />
    <add namespace="MyApp.HtmlHelpers"/>
</namespaces>

<add namespace="MyApp.HtmlHelpers"/>私はすでに残りを持っていたので、行だけが追加されました。

誰でも私を助けることができますか？これまでカスタム html ヘルパーを作成したことがなく、これには困惑しています。

編集

この htmlHelper のビューをレンダリングする方法は次のとおりです。

@using MyApp.HtmlHelpers

@{
    ViewBag.Title = "Object Index";
}

<h2>Object Index</h2>

<p>
    @Html.ActionLink("Create New", "Create")
    @using (Html.BeginForm())
    {
        <p>
            (...)
            Country: @Html.CountryDropDown("countryCode","---Select a country---", ViewData["countryCode"])
            (...)
        </p>
    }
</p>
4

1 に答える 1

1

ああ、それはプレーンテキストとして返しているからです。MvcHtmlString

public static MvcHtmlStringCountryDropDown(
    this System.Web.Mvc.HtmlHelper helper, 
    string name, 
    string optionLabel, 
    object selectedValue)
{
    // your code goes here
    return MvcHtmlString.Create(b.ToString());
}
于 2013-05-02T12:44:31.450 に答える