Bound gridview problem; jquery resolution in unbind?

Good evening all.

I have a bit of a puzzler for you.

On my page I have a cascading ddl (ddlBuyer), a textbox search (tbxProdAC) and a radio button list (radTopx). These, once populated, and a submit button clicked, produces a gridview populated with data. What I am trying to achieve is that the user can only select either the ddl, the textbox or the radiobutton list as a method for producing the gridview data.

I have achieved this, ish, by writing a bit of jquery syntax that essentially 'clears' the gridview and resets the different search methods, for example.

<开发者_如何转开发;code>
    ddlBuyer.Attributes.Add("onclick", 
    "$('#tbxProdAC').val(''); 
    $('#txtbxHowMany').val(''); 
    $('#GridView1').remove(); 
    $('#radTopx input').attr('checked',false); 
    $('#radProd').attr('checked', false);");
</code>

However, because this is occurring client side, the server side events (i.e. ddlBuyer_SelectedIndexChanged) are still being executed and subsequently, the data is being bound when I don't really want it to. i.e. if I select the radtopx button, click the button to produce the gridview (this occurring on a postback).

    if (radTopx.SelectedValue == "" || txtbxHowMany.Text == "")
    {
        MessageBox.Show("Please Ensure that BOTH 'The Number of Products' and Appropriate material Is selected Before You Attempt To Run a TOP x Report", "Top x Error!!!",
             MessageBoxButtons.OK, MessageBoxIcon.Exclamation);
        GridView1.DataSourceID = null;
    }

    else
    {
        int max = 0;
        if (int.TryParse(txtbxHowMany.Text, out max))
        {

            GridView1.DataSource = this.GetMaterialData(Session["MemberKey"].ToString(), radTopx.SelectedItem.Value, "Primary", max);
            GridView1.DataSourceID = String.Empty;
            GridView1.DataBind();
        }
    }

I then click on ddlBuyer, the radTopx information is cleared but the gridview is retained as the following is fired:

    ddlSub.DataSource = queryII;
    ddlSub.DataTextField = "UnitUserfield2";
    ddlSub.DataValueField = "UnitUserfield2";
    ddlSub.DataBind();
    ddlSub.Items.Insert(0, "--Choose Sub Category--");

    GridView1.DataSourceID = null;

Is there a way to 'unbind' the grid view through jquery so that when ddlBuyer is clicked, the gridview has released any data it may have previously held?

Apologies if this doesn't make sense, it is a bit difficult to describe succinctly and accurately.

Sounds interesting MrDean. I've had similar experience trying to unbind events that were previously bound by something else and it can be a bit of a noodle-scratcher. Without seeing an example of what your elements look like (as HTML) it's difficult to know how these events are bound.

If they are bound by simply populating the onclick attribute of each element, this one is quite easy to undo.

$('.myElement').attr('onclick', ''); //Empty out the onclick attribute
$('.myElement').bind('click', function(){ ... }); //Bind your own function to the click event

You'll find it's a much better idea to bind your function using the DOM rather than manipulating attributes of individual elements. It's much more flexible and there's a lot more you can do with it.

Now, if your original functions are bound using the DOM method rather than manipulating the onclick attribute things get a little trickier. The first thing you could try is to go:

$('.myElement').unbind();

which will make jQuery unbind all events associated with a given element. Where this gets tricky is figuring out when to call unbind(). If you do it on ready and the other library executes its ready function after yours, then you've achieved nothing because the events haven't been bound yet.

Give this a try and let me know how you go. Failing that, please upload the HTML of the page you are trying to manipulate and I'll take a look.

Hope this helps!

Cheers

Iain