• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 350
  • Last Modified:

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.
0
searchsanjaysharma
Asked:
searchsanjaysharma
  • 5
  • 3
  • 2
  • +1
1 Solution
 
Roman GhermanSenior Software EngineerCommented:
you could use jquery:

$('#yourDivId').load('Default.aspx');
0
 
Roman GhermanSenior Software EngineerCommented:
0
 
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




0
Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

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

 $("#content").html(data);
0
 
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,
0
 
Kiran SonawaneProject LeadCommented:
Everything you need to put in javascript i.e within <script> tag . Look at my solutions
0
 
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.
0
 
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
0
 
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);" />
0
 
Roman GhermanSenior Software EngineerCommented:
and do not forget to put: AutoPostback=false for the dropdown
0
 
searchsanjaysharmaAuthor Commented:
Thanx
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 5
  • 3
  • 2
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now