Grab information from database and insert into drop down list dynamically

Question

I have a little website where I am trying to grab a certain column from the database(SQL Server Management Studio) and insert these values into a drop down list.

My HTML code loads a simple page with a drop down list.

<html>
<body onload = "Location();">
    <h4>Home Page</h4>
        CompanyName
        <select id="company" name="C1" >
            <option>Pick A Location</option>
        </select>
</body>
<html>

Before my JavaScript function does any "work" it navigates to a c# page. I debugged the c# code and it does output correctly. It shows:

"<root>\n<CompanyName>\n\t<option>AAA</option>\n\t<option>BBB</option>\n\t<option>CCC</option>\n\t<option>DDD</option>\n\t<option>EEE</option>\n\t<option>FFF</option>\n\t<option>GGG</option>\n\t<option>HHH</option>\n</CompanyName>\n</root>"

which is just the columns from the database that I need to input into the drop down list. The javascript function is supposed to grab this chunk of code and dive into the option section and put each option into the drop down list one by one. For some reason between navigating from the c# page to the javaScript page, i lose the xml information. Is there something that I am missing or is there something incorrect? Thank you.

function Location() {

    $.ajax({
        url: "Test.aspx",
        beforeSend: function (xhr) {
            xhr.overrideMimeType("text/plain; charset=x-user-defined");
        }
    }).done(function (data) {
        if (console && console.log) {
            xml = data;
            xmlDoc = $.parseXML(xml);
            $xml = $(xmlDoc);
            var settingHTML = "";
            settingHTML += "<option value = 'null' > Pick a Location </option>";
            $xml.find('root').each(function () {
                $xml.find('CompanyName').each(function () {
                    // one at a time
                    $(this).children().each(function () {
                        settingHTML += "<option value='" + $(this).text() + "' >" + $(this).text() + "</option>";
                    });
                });
            });
            $("#company").html(settingHTML);
        }
    });
}

I am also going to add my c# code as it seems that it could be the way I am returning the string possibly

public partial class Test : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        string root = "<root>\n";
        root += fill_company();
        root += "</root>";
        Response.Write(root);
    }

    protected string fill_company()
    {
        OdbcDataReader reader;
        string myConnString = "DSN=DevSql12-1;";
        OdbcConnection conn = new OdbcConnection(myConnString);
        OdbcCommand mycommand = new OdbcCommand();
        mycommand.Connection = conn;
        conn.Open();
        mycommand.CommandText = "SELECT CompanyName FROM [PS_Settings].[cams].[Client];";
        reader = mycommand.ExecuteReader();
        string CompanyLocation = "";
        CompanyLocation += "<CompanyName>\n";
        object[] meta = new object[1];
        bool read;
        if (reader.Read() == true)
        {
            do
            {
                int NumberOfColumns = reader.GetValues(meta);
                for (int i = 0; i < NumberOfColumns; i++)
                {
                 CompanyLocation += "\t<option>" + meta[i].ToString() + "</option>\n";
                }
                read = reader.Read();
            } while (read == true);
        }
        CompanyLocation += "</CompanyName>\n";
        return CompanyLocation;
    }
}

For some reason the "root" string in the c# code which is a string of xml, is not being sent over to the "data" variable in the js "location" function — ItalianStallion, Jul 08 '14 at 22:25
You should probably review this:http://stackoverflow.com/questions/543319/how-to-return-xml-in-asp-net — Kaizen Programmer, Jul 09 '14 at 14:50

score 0 · Accepted Answer · answered Jul 10 '14 at 20:29

0

The issue was that I didn't show the actual output (wasn't actually AAA, BBB), but the reason for my error is because one of the options had an '&', and I forgot to escape it.

answered Jul 10 '14 at 20:29

ItalianStallion

296
2
4
13

Grab information from database and insert into drop down list dynamically

1 Answers1