Need "How To" Help with ASP.NET Dynamic List View

Experts,

I'm struggling to come up with a "Best way" to solve a problem, and need your expert guidance.  I have an ASP.NET page that displays summarized data about employee work shifts.  This data is displayed in a list view.  Each line of the list view is summarized from one or more individual records in my SQL Server database.  I want to put a link on each line of the list view that the user can click.  Clicking this link would show a floating div with another list view that would show the detailed records from the database that rolled up to that summary line.  Inside this DIV would be a button to close (hide) the detailed view.

I already have a stored procedure written that would get the data for this DIV pop-up, which requires three parameters.  My desired flow is:

1. Summary ListView is populated on Page Load.

2. Each Row of ListView has a Details LinkButton. The Stored Procedure needs three parameters that are unique for each row of the ListView: Employee ID, Start DateTime, End DateTime.

3. When the user Clicks The Detail LinkButton, it fires a procedure that collects the three needed parameters from the row, passes them to the stored procedure, and uses the returned dataset to bind to the Details list view that is held in a floating Pop-Up style DIV.

4. When the user is done reviewing the detail data, they click the Close button in the pop-up div, and the div is hidden again.

5. I want all of this to be Asynch (working inside an update panel) so I don't want the link to fire out to a whole new page with query string parameters. I want it to be something where they click the detail button, the detail div pops up with the data in it, they close it, and move on down the list clicking the details button as desired to view the details for each employee, all without the page constantly being reloaded.


I know how to make it all work, except the part of how to structure the initial summary ListView LinkButton to initiate the procedure that would call the stored procedure, bind the result to the detail list view, and show the detail pop-up DIV.

Guidance?

Thanks,

John
John ParkerService Quality ManagerAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Ess KayEntrapenuerCommented:
Simply, when the user clicks the emplyee name, it passes the emplyee ID number to the method which gets the details

You can add alternate text there to keep the number


        <asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="Images/Summary.png"
            OnClick="ImageButton_Click" AlternateText="id Number" />



Next, in your code you have the button click method

protected void ImageButton_Click(object sender, ImageClickEventArgs e)
        {
            string alternateText = (sender as ImageButton).AlternateText;
         YourFunctionToOpenDetailsPopup(   alternateText   );
         
        }
0
apeterCommented:
Make a ajax call to get the details data to show in the pop up when clicking the link button. This will be fast and page is not loaded again.
0
John ParkerService Quality ManagerAuthor Commented:
@esskayb2d, I need three parameters for the SP Call though...  How would I handle three parameters in your suggestion?

@apeter, what ASP.NET controls would you use to manage this ajax call?  I have these list views within an update panel, and was thinking this morning that I could just make a link in each line referencing the same page and add the three parameters I need into the query string.  If the postback had these three parameters, then the popup would be shown, but if they were not included, then the postback would do nothing.  if these links existed within the update panel, then this activity should be asynch and only affect the data within the update panel, correct?
0
The Ultimate Tool Kit for Technolgy Solution Provi

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy for valuable how-to assets including sample agreements, checklists, flowcharts, and more!

Ess KayEntrapenuerCommented:
I can think of a couple of ways you can pass 3 params.


1 - seperate the params with a delimiter IE : (*), then in the function, use regex or substring to get first second and 3rd
  Example  :
<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="Images/Summary.png"
            OnClick="ImageButton_Click" AlternateText="PARAM1*PARAM2*PARAM3" />
protected void ImageButton_Click(object sender, ImageClickEventArgs e)
        {
            string alternateText = (sender as ImageButton).AlternateText;
    String Params[2];

     int index = alternateText.IndexOf('*');
     Params[0]  = alternateText.Substring(0, index);  //GET FIRST PARAM
     index = alternateText.IndexOf('*', index + 1);
     Params[1]  = alternateText.Substring(Params[0].length+1, index);  //GET SECOND PARAM
     Params[2]  = alternateText.Substring( index + 1, alternateText.length );  //GET THIRDPARAM
         YourFunctionToOpenDetailsPopup(   alternateText   );
         str.Substring(0, str.IndexOf(' ', index + 1))
        }

Open in new window




2. Embed the criteria as SQL inside the AlternateText:

Example:
<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="Images/Summary.png"
            OnClick="ImageButton_Click" AlternateText=" WHERE param1 = 'x' AND param2 = 'y' AND param3 = 'z' " />
0
John ParkerService Quality ManagerAuthor Commented:
Thanks esskayb2d.  I thought about doing a delimiter... that's definitely an option.  Thank you for your input!
0
Ess KayEntrapenuerCommented:
You might want to avoid the sql way, if this is online, it will be easy to inject    something like "OR 1<>2   BEGIN DROP TABLE * ...."
0
John ParkerService Quality ManagerAuthor Commented:
Agreed, that is why I was pushing the way of a stored procedure to handle the database interaction.

@apeter, I'm still interested in your feedback.

Thanks to you both!
0
Ess KayEntrapenuerCommented:
You can also pass as xml value <params><param1>X</param1><param2>2</param2><...></params>


This way you can just pass the whole string to the database, as an XML values, and handle from the stored procedure



declare @XML xml = '<ROOT><id>2013-01-01</id><id>2013-01-02</id></ROOT>'

select T.N.value('text()[1]', 'date') as id
from @XML.nodes('ROOT/id') as T(N)
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
John ParkerService Quality ManagerAuthor Commented:
Ah, yes, that is a good idea as well.  Thank you!
0
apeterCommented:
Your own ajax call will give you more control and how you control.  This link will give you more details on how to make ajax call in asp.net.  http://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/

You can pass any number of parameters and return data accordingly.
0
John ParkerService Quality ManagerAuthor Commented:
@apeter, thanks!  I'm going to split the points between both of you, as I think either solution is viable, and I appreciate you contributing your thoughts!  Thank you.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP.NET

From novice to tech pro — start learning today.