-
freddy
Member
-
Posts: 131
Threads: 17
Joined: Nov 2014
Reputation:
3
08-27-2015, 01:22 AM
(This post was last modified: 08-27-2015, 01:26 AM by freddy.)
Hello all guys, thanks for support in the past, well i have some problem now during develop projects, here is my dummy view without databse
Code: <script type="text/javascript">
$(document).ready( function() {
//if all href click
$("a[href]").click(function(){
//how can i select the id from table then show it in every each if (id, status limit 5)
if($(this).attr("id")=="4"){
var value = $(this).attr("id");
$.ajax({
type: "post",
url: "index.php/welcome/loadContent1",
data: "valueName=" + value,
success: function(result){
$("#content").html(result);
}});
}
//function spefisik if click href by get id
else if($(this).attr("id")=="2"){
$.ajax({
url: "index.php/welcome/loadContent2",
success: function(result){
$("#content").html(result);
}});
}
//function spefisik if click href by get id
else if($(this).attr("id")=="3"){
$.ajax({
url: "index.php/welcome/loadContent3",
success: function(result){
$("#content").html(result);
}});
}
});
});
</script>
<!--here is id should came from database, if this i can show it but in jquery file i don't know --->
<a href="#" id="1">1</a>
<a href="#" id="2">2</a>
<a href="#" id="3">3</a>
<div class="container" id="content" style="width:100%;min-height:500px;background-color:#CCFF99">
<h1>when an unknown printer took a galley </h1>
<p>
when an unknown printer took a galley
of type and scrambled it to make a type
specimen book. It has survived not only
five centuries, but also the leap into
electronic typesetting, remaining essentially
unchanged. It was popularised in the 1960s
with the release of Letraset sheets containing
Lorem Ipsum passages, and more recently with
desktop publishing software like Aldus PageMaker
including versions of Lorem Ipsum.
</p>
<p>
when an unknown printer took a galley
of type and scrambled it to make a type
specimen book. It has survived not only
five centuries, but also the leap into
electronic typesetting, remaining essentially
unchanged. It was popularised in the 1960s
with the release of Letraset sheets containing
Lorem Ipsum passages, and more recently with
desktop publishing software like Aldus PageMaker
including versions of Lorem Ipsum.
</p>
<p>
when an unknown printer took a galley
of type and scrambled it to make a type
specimen book. It has survived not only
five centuries, but also the leap into
electronic typesetting, remaining essentially
unchanged. It was popularised in the 1960s
with the release of Letraset sheets containing
Lorem Ipsum passages, and more recently with
desktop publishing software like Aldus PageMaker
including versions of Lorem Ipsum.
</p>
<p>
when an unknown printer took a galley
of type and scrambled it to make a type
specimen book. It has survived not only
five centuries, but also the leap into
electronic typesetting, remaining essentially
unchanged. It was popularised in the 1960s
with the release of Letraset sheets containing
Lorem Ipsum passages, and more recently with
desktop publishing software like Aldus PageMaker
including versions of Lorem Ipsum.
</p>
<p>
when an unknown printer took a galley
of type and scrambled it to make a type
specimen book. It has survived not only
five centuries, but also the leap into
electronic typesetting, remaining essentially
unchanged. It was popularised in the 1960s
with the release of Letraset sheets containing
Lorem Ipsum passages, and more recently with
desktop publishing software like Aldus PageMaker
including versions of Lorem Ipsum.
</p>
<p>
when an unknown printer took a galley
of type and scrambled it to make a type
specimen book. It has survived not only
five centuries, but also the leap into
electronic typesetting, remaining essentially
unchanged. It was popularised in the 1960s
with the release of Letraset sheets containing
Lorem Ipsum passages, and more recently with
desktop publishing software like Aldus PageMaker
including versions of Lorem Ipsum.
</p>
</div>
those script i code then realase that id suppose to be came from databse cause it will not 1-4 it dynamic, how can i do that, i'm not familiar with jquery ajax so i posted here so you can help me out, thanks
-
freddy
Member
-
Posts: 131
Threads: 17
Joined: Nov 2014
Reputation:
3
(08-27-2015, 11:58 AM)mwhitney Wrote: This is really just a matter of how you choose to create the HTML when you output the database results and how you want to be able to reference them in your JavaScript. For example, you could add a class or data-* attribute to each of the links and use that to select the collection of links, then use $.each() or some other jQuery method to select specific items from the collection. Alternatively, when you build the HTML, you could build the ID as well:
PHP Code: <?php $count = 1; foreach ($links as $link) : ?> <a href='#' id='link_<?php echo $count; ?>'><?php echo $link->text; ?></a> <?php ++$count; endforeach; ?>
Thanks mwhitney for your reply, let me analysis first, by my case above i should show limit 5 from database if i using your view to make it happend so in my jquery only use selettor like this ya
Code: if($(this).attr("id")=="link_1"){
}else if
($(this).attr("id")=="link_2"){
} else if($(this).attr("id")=="link_3"){
} else if($(this).attr("id")=="link_4"){
} else if($(this).attr("id")=="link_5"){
}
Last question is it bad for write jquery coding like that, i mean it give repetation see all programmers want to write clean code, but thanks for quick reply +1000 for you, LOL
-
Paradinight
Senior Member
-
Posts: 446
Threads: 6
Joined: Jun 2015
Reputation:
25
08-28-2015, 09:34 AM
(This post was last modified: 08-28-2015, 09:37 AM by Paradinight.)
(08-27-2015, 07:03 PM)freddy Wrote: (08-27-2015, 11:58 AM)mwhitney Wrote: This is really just a matter of how you choose to create the HTML when you output the database results and how you want to be able to reference them in your JavaScript. For example, you could add a class or data-* attribute to each of the links and use that to select the collection of links, then use $.each() or some other jQuery method to select specific items from the collection. Alternatively, when you build the HTML, you could build the ID as well:
PHP Code: <?php $count = 1; foreach ($links as $link) : ?> <a href='#' id='link_<?php echo $count; ?>'><?php echo $link->text; ?></a> <?php ++$count; endforeach; ?>
Thanks mwhitney for your reply, let me analysis first, by my case above i should show limit 5 from database if i using your view to make it happend so in my jquery only use selettor like this ya
Code: if($(this).attr("id")=="link_1"){
}else if
($(this).attr("id")=="link_2"){
} else if($(this).attr("id")=="link_3"){
} else if($(this).attr("id")=="link_4"){
} else if($(this).attr("id")=="link_5"){
}
Last question is it bad for write jquery coding like that, i mean it give repetation see all programmers want to write clean code, but thanks for quick reply +1000 for you, LOL
Not Good
PHP Code: <?php foreach ($links as $link) : ?> <a href='#' data-myid='<?php echo $link->linkid ?>'><?php echo $link->text; ?></a> <?php endforeach;?>
In you Script use $( "{you selector}" ).data( "myid" )
Code: var myid = $( "{you selector}" ).data( "myid" );
$.ajax({
url: "index.php/welcome/loadContent/" + myid,
success: function(result){
$("#content").html(result);
}});
https://api.jquery.com/data/
|