CODEWITHSUNDEEP
asp.netjavascriptjqueryasp.net-ajaxuser-controls
balexandre
balexandre

Reputation: 75083

Pass a value and reload User Control from Javascript

I have a User control (because I use the same in other page, so I thought I should reuse code and not double my work), but in this page I show a list of companies and each one has a company number, I need to pass this company number to that User Control and it has to reload using that passed company number.

How can I accomplish this?

what I have so far:

alt text http://www.balexandre.com/temp/2009-09-17_0917.png

the Show company structure link is made of

<a href="javascript:showStruct('112:201334607','5564967221');" 
   class="showStructLink">Show company structure</a>

the showStruct method is written like

  function showStruct(pid, cnr) {
     if (_showStrut == 0)
        return;

     // fancy stuff to be more apealing visually
     $("#tdSearch").removeClass("tabTitleUp01").addClass("tabTitleDownUp01");
     $("#tdStruct").removeClass("tabTitleDownUp02").addClass("tabTitleUp02");

     $("#srtr1").hide();
     $("#srtr2").hide();
     $("#sttr1").show();

     // enable Search Results tab to be clicked in order to get back
     $("#tdSearch")
        .addClass("pointer")
        .bind("click", function() { hideStructure(); });

     // pass the company number and reload wcCompanyStruture web user control
     // __doPostBack('RefreshWebUserControl', cnr);
  }

I can make a simple aspx page with the control inside and from jQuery invoke $.get() to run and populate the control correctly, but I really want to learn how to do this properly, using the ASP.NET AJAX Method to send a number and call RefreshData on it

using code-behind it is easy to refresh the user control, just invoking

wcCompanyStruture.RefreshData("companyNumberHere");

what do I need to do in my User Control side and well in the showStruct method to create this behavior?

All help is appreciated, Thank you.

Upvotes: 2

Views: 9215

Answers (3)

Helo
Helo

Reputation: 1054

I know this is not the answer to you question but I think you may be asking the wrong question.

It looks to me as if you have a search result+details view scenario that you are going about the wrong way.

When you click "Show Company structure" you want to see the details on the second tab right? If this is the case then the tab approach would be confusing to the user, it would be better with a modal popup that shows the details. No postback just AJAX load a page with the details into a modal popup window.

This is very easy with JQuery using the dialog widget in JQueryUI and the AJAX load function $('#SomeDiv').load('details.aspx?id='+companyid);

http://docs.jquery.com/Ajax/load#urldatacallback

It would give a much better user experience and it is surprisingly simple to code.

I hope this helps.

Upvotes: 5

Sam Bauwens
Sam Bauwens

Reputation: 1367

You can use a LinkButton for each "Show Company Structure" link, and set the CommandArgument property with the corresponding company id. The LinkButton will cause a postback.

A second solution would be to use a hidden variable : <input type="hidden" id="hiddenCompanyNumber"> and set it's value in the showStruct method. You can then call __doPostBack(), for which you need a control upon which to postback I think.

All in all, I think the first solution is less hacky.

Upvotes: 0

Kronass
Kronass

Reputation: 5406

You can find it here

http://codeclimber.net.nz/archive/2007/06/26/how-to-refresh-an-updatepanel-from-javascript.aspx

don't worry about the article title it has what you need Just do the four steps and you are ready to go.

Upvotes: -2

Related Questions