2

I load templates into container with jQuery .load function:

 $('#container').load('templates/list.php');

But when it loaded, doesnt work any other jQuery function. For example, i load template:

<a href="#/phone" class="btn btn-primary btn-xs" id="phone_req">OK</a></div>

and add to my script.js 

$('#phone_req').click(function(){
  console.log('Phone');
});

after loading, i click on button, but nothing happend. Please tell me where I'm wrong

Silver22
  • 35
  • 4

2 Answers2

1

You need to use .on() and add the event listener to a parent element to the <a> tag.

Do something like this:

$('#container').on('click','a.btn',function(e){
    //do something...
});

Read more here Event binding on dynamically created elements? and here jQuery docs .on()

Community
  • 1
  • 1
llernestal
  • 576
  • 2
  • 8
  • ok, to solve this. How to get the value from the INPUT are loaded? .val Method does not work – Silver22 Jan 25 '15 at 13:01
  • By reading the code you have posted, I'm not able answer that. You should create a new question for that and post your javascript code and HTML... or maybe read up on the jQuery documentation? ;) – llernestal Jan 25 '15 at 13:05
0

Bro, You can try this

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>

<style type="text/css">
    body{
  margin:0;
  padding:0;
  overflow-x:hidden;
 }
 
 #container{
  width:300px;
  height:200px;
  border:1px solid;
 }
</style>

</head>

<body>

    <div id="container"></div>
    
    <a href="#/phone" class="btn btn-primary btn-xs" id="phone_req">OK</a></div>
    
    <script>
     $('#container').load('list.php');
  $('#phone_req').click(function(){
            console.log('Phone');
   
        });
 </script>


</body>
</html>
Gourab Mazumder
  • 31
  • 1
  • 3