How to call / embed a .aspx file in div tag on the basis of dropdown selection.

1.I have a drop down. ddlquarters
2.It has 5 values as fiel1, file2, file3, file4, file5.
3.I have a div below the dropdown with id "displaydiv"
4.I also have 5 .aspx files, a.aspx,b.aspx,c.aspx,d.aspx,e.aspx
5.I want when a user selects file1 from dropdown, the div should load a.aspx
when user selects file2, the div should load b.aspx and so on.
searchsanjaysharmaAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
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.

Roman GhermanSenior Software EngineerCommented:
you could use jquery:

$('#yourDivId').load('Default.aspx');
Roman GhermanSenior Software EngineerCommented:
Kiran SonawaneProject LeadCommented:
Jquery ajax to do this

1) Add jquery file in head tag OR below line in head tab
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>

Open in new window

2) Add CssClass="cssFile" to your dropdown
3) Add below code in your head tag
 <script>
  $(document).ready(function(){
    $(".cssFile").change(function(){
      
       $.ajax({
  url: $(this).val(), // Suppose your dropdown has value file1.aspx, file2.aspx...
  context: document.body,
  success: function(data){
     $("content").html(data); // Assume your div (to which you want to show data from file) id is content
  }
});

   });
 });
</script>

Open in new window




Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

chaitu chaituCommented:
to make small change in kiran's code.make the below change

 $("#content").html(data);
searchsanjaysharmaAuthor Commented:
How do i put in .aspx.cs file.
if(ddlquarters.SelectedItem.Text=="file1")
{
          $('aa').load('a.aspx');
}
else if(ddlquarters.SelectedItem.Text=="file2")
{
          $('aa').load('a.aspx');
}
and so on,
Kiran SonawaneProject LeadCommented:
Everything you need to put in javascript i.e within <script> tag . Look at my solutions
Roman GhermanSenior Software EngineerCommented:
How do i put in .aspx.cs file.
if(ddlquarters.SelectedItem.Text=="file1")
{
          $('aa').load('a.aspx');
}
else if(ddlquarters.SelectedItem.Text=="file2")
{
          $('aa').load('a.aspx');
}
and so on,

Not in aspx.cs file but you need to put that in aspx file as javascript script and put the onselectedindexchanged on the dropdown.
searchsanjaysharmaAuthor Commented:
That is understood, but then how do i trap the asp dropdown in .aspx file, as the event gets open in .aspx.cs file
Roman GhermanSenior Software EngineerCommented:
<script>
function loadDivContent(ddl)
{
if(ddl.value=="file1")
{
          $('#aa').load('a.aspx');
}
else if(ddl.value =="file2")
{
          $('#aa').load('b.aspx');
}
....
}
</script>
....
<asp:dropdown id="ddlquarters" .... onchange="loadDivContent(this);" />

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
Roman GhermanSenior Software EngineerCommented:
and do not forget to put: AutoPostback=false for the dropdown
searchsanjaysharmaAuthor Commented:
Thanx
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.