CODEWITHSUNDEEP
javascriptasp.net
RealMan
RealMan

Reputation: 129

JavaScript Error: Unable to get property 'style' of undefined or null reference?

I created DropDownList with checkboxes
There was an error in js: 

document.onclick = check;
function check(e) {
    var target = (e && e.target) || (event && event.srcElement);
    var obj = document.getElementById('divChkList');
    var obj1 = document.getElementById('ddlChkList');
    if (target.id != "alst" && !target.id.match("chkLstItem")) {
        if (!(target == obj || target == obj1)) {
            obj.style.display = 'none'
        }

html : 

<table>
      <tr>
            <td valign="top" style="width: 165px">
                  <asp:PlaceHolder ID="phDDLCHK" runat="server"></asp:PlaceHolder>
            </td>
            <td valign="top">
                  <asp:Button ID="btn" runat="server" Text="Get Checked" OnClick="btn_Click" />
            </td>
            <td valign="top">
                  <asp:Label ID="lblSelectedItem" runat="server"></asp:Label>
            </td>
      </tr>
</table>
<asp:HiddenField ID="hidList" runat="server" />

Here is the code cs in Page_load
Here I've defined dropdownlist: 

 DropDownList ddl = new DropDownList();
        ddl.ID = "ddlChkList";
        ListItem lstItem = new ListItem();
        ddl.Items.Insert(0, lstItem);
        ddl.Width = new Unit(155);
        ddl.Attributes.Add("onmousedown", "showdivonClick()");
        CheckBoxList chkBxLst = new CheckBoxList();
        chkBxLst.ID = "chkLstItem";
        chkBxLst.Attributes.Add("onmouseover", "showdiv()");
        DataTable dtListItem = GetListItem();
        int rowNo = dtListItem.Rows.Count;
        string lstValue = string.Empty;
        string lstID = string.Empty;
        for (int i = 0; i < rowNo - 1; i++)
        {
            lstValue = dtListItem.Rows[i]["Value"].ToString();
            lstID = dtListItem.Rows[i]["ID"].ToString();
            lstItem = new ListItem("<a href=\"javascript:void(0)\" id=\"alst\" style=\"text-decoration:none;color:Black; \" onclick=\"getSelectedItem(' " + lstValue + "','" + i + "','" + lstID + "','anchor');\">" + lstValue + "</a>", dtListItem.Rows[i]["ID"].ToString());
            lstItem.Attributes.Add("onclick", "getSelectedItem('" + lstValue + "','" + i + "','" + lstID + "','listItem');");
            chkBxLst.Items.Add(lstItem);
        }
        System.Web.UI.HtmlControls.HtmlGenericControl div = new System.Web.UI.HtmlControls.HtmlGenericControl("div");
        div.ID = "divChkList";
        div.Controls.Add(chkBxLst);
        div.Style.Add("border", "black 1px solid");
        div.Style.Add("width", "160px");
        div.Style.Add("height", "180px");
        div.Style.Add("overflow", "AUTO");
        div.Style.Add("display", "none");
        phDDLCHK.Controls.Add(ddl);
        phDDLCHK.Controls.Add(div);

The error here obj.style.display = 'none'

I have been looking online for a fix and nothing is working?

What am I doing wrong?

Upvotes: 0

Views: 2201

Answers (1)

Jones Joseph
Jones Joseph

Reputation: 4938

HMTL provided in the question does not have an element with ID divChkList

Even if it existed, The correct way of calling an ASP.net control would be like this

var obj = document.getElementById('<%=divChkList.ClientID%>');

This is because asp.net does not render the same id you specify in the markup of a server control , unless to specify to keep it static.

Upvotes: 2

Related Questions