0

Hi i am developing an application inMVc3
I have a model containing 

Hobbyname 
Hobbyurl

I have drawn a table and in the first column i fetch all the hobbynames and display it as a link. Hobbyurl contains the url of a page associated with the Hobbyname Now when i click the Hobbyname from lefthand side i want the contents to be loaded in the right side i use an Iframe to display the contents so i need the Iframe to be loaded again and again on click.

To fetch the Hobbynames i used the foll code:

 <td>
 <ul>
  @foreach (var item in Model)
  {
   <li> @Html.ActionLink(item.HobbyName, "Hobbies")</li>
  }
 </ul>
 </td>
 <td>
 <div>
 <iframe id="iframe"></iframe>
 </div>
 </td>

and Here is the script:

<script type="text/javascript">
$('a').click(function () {
    $('iframe').attr('src', "/HobbyHomes/Test");
}); 
</script>

But i am not able to load the Iframe on click of the link. Please help me

MVC_Nhibernate
  • 307
  • 7
  • 22

2 Answers2

0

You could try,

$(function(){
   $('a').click(function(){
     $('iframe').attr('src', "/Controller/Action");
   });
});

Haven't tested this though..

Robin Maben
  • 19,662
  • 16
  • 61
  • 93
  • Hi i tried ur solution but nothing gets loaded in the Iframe i think i may be wrong in providing the path like i wrote it directly as $('iframe').attr('src', "test.cshtml"); can u please direct me with this – MVC_Nhibernate Apr 23 '12 at 07:24
  • @MVC_Nhibernate: See my edit. Have you tried something like that? – Robin Maben Apr 23 '12 at 08:27
  • Hi i tried dat too but it does not work:( i have updated my question and did exactly as u said..please see and tell me where i m goin wrong. – MVC_Nhibernate Apr 23 '12 at 08:45
0

your probably wanting to attach your onclick after the dom is loaded, like so 

<script type="text/javascript">
$(document).ready(function(){
  $('a').click(function (e) {
    e.preventDefault();
    $('iframe').attr('src', "/HobbyHomes/Test");
  }); 
});
</script>
m.t.bennett
  • 1,252
  • 12
  • 27
  • hi with this it shows the page inside the Iframe when i click onit but only for few seconds and then it goes keeping the Iframe empty..how shall i overcome this – MVC_Nhibernate Apr 23 '12 at 08:58
  • I have edited it so that it adds the parameter 'e' being passed into the click (this is the event object) and added a line inside the function e.preventDefault() which stops the event bubbling up. My theory is that the anchor is setting the frame but doing a full postback of the page after that resetting everything. – m.t.bennett Apr 23 '12 at 09:57
  • Thanks - you'll probably want to initialize most things in the $(document).ready function :) – m.t.bennett Apr 23 '12 at 10:30
  • @MVC_Nhibernate: I believe `.ready()` is out of the scope of the original question. – Robin Maben Apr 23 '12 at 11:35
  • How can it be when it's the solution? He couldn't load the iframe because he needed to attach the click handler after the DOM was loaded, which requires a ready-type method call. – m.t.bennett Apr 23 '12 at 11:45