|
Hi greeting to the comunity!!
I´m trying to display the info from a array json dinamically into an html table, but I'm dont really undertand what I`m doing wrong
so, I`m taking three columns from my MySql Table (Name,city and Provinz),so I need a row for each row of my sql table, if a obtain three rows , that is in total 9 cells,ordered in three rows, 3 each..
onload() on body calls the function
function verDetalleNegocio(){
var localidad=getLocalidad();
var negocio=getNegocio();
var datos={'loc':localidad,'neg':negocio};
var datosS=JSON.stringify(datos);
if(localidad!=="" && negocio!==""){
$.ajax({
type:"POST",
data:"datos="+datosS,
dataType:'json',
cache:false,
url:"<?=$this->basePath("web/negocios/detallenegocioajax")?>",
success:function(datos){
var celdas=datos.length;
var filas=celdas/3;
for(i=0;i<datos.length;i++)
{
$("#tabdat").append("<tr>");
$("#tabdat").append("<td>"+datos[i]+"</td>");
$("#tabdat").append("</tr>");
}
}
});
}else{
return null;
}
}
here, I habe my html table:
</head>
<body onload="verDetalleNegocio()">
<table id="tabdat" class="tablaNeg" border=1>
<thead>
<tr>
<th>Nombre</th>
<th>Localidad</th>
<th>Provincia</th>
</tr>
</thead>
<tbody></tbody>
</table>
</body>
and finally, thatt the way the results are display, I would like to show the rows, one on top of the other, and not one next to the other, hoy could say in the iteration, every three, a new row!!!
Thanks!!!
Nombre Localidad Provincia
Naviera Riazor La Coruña La Coruña Barcos Texeiro La Coruña La Coruña Barcos de Vela Riazor La Coruña La Coruña
|
|
|
|
|
It looks like you are creating a new row for each item in the code:
for(i=0;i<datos.length;i++)
{
$("#tabdat").append("<tr>");
$("#tabdat").append("<td>"+datos[i]+"</td>");
$("#tabdat").append("</tr>");
}
You should move the <tr> tags outside the loop thus:
$("#tabdat").append("<tr>");
for(i=0;i<datos.length;i++)
{
$("#tabdat").append("<td>"+datos[i]+"</td>");
}
$("#tabdat").append("</tr>");
|
|
|
|
|
Hi!!
thanks a lot for your reply!!
unfortunatelly, after the changes you proposed me, I get the same result
I`ll keep trying!!
|
|
|
|
|
It would help us if you showed the actual code you use, and the HTML that is produced when you run it. You can edit your question and add the update information.
|
|
|
|
|
Hi again!!
thanks for your reply, so I put it down the proposal of a colleage from stackoverflow...there I posted the same question..
so the json array comes from the controller, filtered with json_encode();, this is the copy paste from the Chome debugger..so as you can see, I want to display the array of 9 positions in three
rows one under other, and each with three cells..
0: "Naviera Riazor"
1: "La Coruña"
2: "La Coruña"
3: "Barcos Texeiro"
4: "La Coruña"
5: "La Coruña"
6: "Barcos de Vela Riazor"
7: "La Coruña"
8: "La Coruña"
length: 9
this is the table, with a script, that I dont know if is "key" so that everything goes good..
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="tabdat" border=1 style="margin-top: 300px;">
<thead>
<tr>
<th>Nombre</th>
<th>Localidad</th>
<th>Provincia</th>
</tr>
</thead>
<tbody></tbody>
</table>
</body>
and here is the function verDetalleNegocio(), that I invoke on the body with the onload method, inside I do the
loop, and try to display on the #tabdat, under...
function verDetalleNegocio(){
var localidad=getLocalidad();
var negocio=getNegocio();
var datos={'loc':localidad,'neg':negocio};
var datosS=JSON.stringify(datos);
if(localidad!=="" && negocio!==""){
$.ajax({
type:"POST",
data:"datos="+datosS,
dataType:'json',
cache:false,
url:"<?=$this->basePath("web/negocios/detallenegocioajax")?>",
success:function(datos){
html = "";
for(i=0; i<datos.length; i++){
html += "<tr>"
html += "<td>"+datos[i]+"</td>";
html += "<td>"+datos[i]+"</td>";
html += "<td>"+datos[i]+"</td>";
html += "</tr>";
}
$("#tabdat tbody").append(html);
}
});
}else{
return null;
}
}
and finally the result that I obtain on the screen..as you can see, the information is displayed twice...please, tell me If i can put more infomation...thanks
Nombre Localidad Provincia
Naviera Riazor Naviera Riazor Naviera Riazor
La Coruña La Coruña La Coruña
La Coruña La Coruña La Coruña
Barcos Texeiro Barcos Texeiro Barcos Texeiro
La Coruña La Coruña La Coruña
La Coruña La Coruña La Coruña
Barcos de Vela Riazor Barcos de Vela Riazor Barcos de Vela Riazor
La Coruña La Coruña La Coruña
La Coruña La Coruña La Coruña
|
|
|
|
|
Look at your code, in the loop you are printing the same item html += "<td>"+datos[i]+"</td>"; three times. I showed you what the code should be in my original response.
|
|
|
|
|
Hi!!
thanks for your reply..you`re right...
now I changed the format of the array, and now its like this:
0: ["Naviera Riazor"]
1: {1: "La Coruña"}
2: {2: "La Coruña"}
3: ["Barcos Texeiro"]
4: {1: "La Coruña"}
5: {2: "La Coruña"}
6: ["Barcos de Vela Riazor"]
7: {1: "La Coruña"}
8: {2: "La Coruña"}
length: 9
The problem is, that I dont find the way to display properly the info in the html, table,I tryed with a double loop, first for, and secon inner do...while, and two for consecutives, thats mean one inside the other..but It doesn`t work...to ne honest, sometimes I think I'm doing it very complicated, maybe there is another way to do it more simple..
var html="";
var celdas=datos.length;
var filas=celdas/3;
var cont=0;
for(f=0;f<filas;f++)
{
do{
html+="<tr>";
html+="<td>"+datos[f][cont]+"</td>";
html+="</tr>";
cont++;
}while(cont<=2);
}
$("#tabdat tbody").append(html);
Thanks!!
|
|
|
|
|
Loo,k at the data and decide how many items you want in each row. You then can set the values for your loop. For each iteration of the loop:
1. Emit a <tr> element.
2. Emit a <td> followed by the first data item, followed by </td>
3. Repeat number 2 for each remaining data item.
4. Emit a </tr> item for the end of the row.
|
|
|
|
|
Every time I try to change the color for the text "You qualify for Free Shipping!
the script breaks.
can someone please write it in for me to show me where it goes?
Im trying to turn it Green
thank you
DEX
<br><script>
var freeship = 65;
var total = "[CARTTOTAL]";
var totalnum = total.replace("$", "");
if (totalnum < freeship){
rounded = Math.round((freeship - totalnum)*100)/100;
document.write(" <div align=left><h1><strong><span class=price-alt>Only $");
document.write(rounded.toFixed(2) + " ");
document.write("more and you qualify for Free Shipping! </span></div><br>");
} else { document.write("<div align=left><h1><strong> You qualify for Free Shipping! </strong></h1></div><br>");
}
</script>
|
|
|
|
|
In the first set you have unclosed <strong> and <h1> tags.
|
|
|
|
|
I don't understand why you sent me a private email with the same information. I have explained what looks incorrect so you need to fix that first.
|
|
|
|
|
I'm looking for documentation engine for API reference, tutorials and product blog with the following requirements:
- Implemented in JS and has JS API
- Generates static content
- Support themes
- Does not require accounts but Github, so Gitbook with their migration to his own commercial service is just a shame
- Well designed, created by developers for developers
- Has live community, tutorials and documentation
|
|
|
|
|
Hi,
I have a Pin Code verification field, in which I am using an invalid input regular Expression, but I want to have check for min of 4 characters in it. Here are my invalid characters:
Name: "InvalidCharacters", Expression: '([<>_={};|\\[\\]^])'
I want to have another Regular Expression validator which doesn't allow above characters and checks for min of 4 and max 40 characters, any help would be greatly helpful, thanks in advance.
modified 12-Mar-19 14:22pm.
|
|
|
|
|
|
Can I use two regular expressions on one field in html?
Some how I could able to put the below attribute in the input text, it shows red mark when the number of characters are less than 4 but it doesn't show me the message:
pattern=".{4,40}"
Any idea would be very very helpful, thanks
What I have to achieve is to display the message smartly depending upon the failing regex, there are two checks, 1 is invalid characters and when the focus is out of textbox, if length is less than 4 characters, then, it should display message saying, minimum length is 4 characters.
Currently its working for invalid characters as below:
<div class="field-validation-error" *ngIf="pinCodeInput.errors !== null && pinCodeInput.errors.regexValidator">
{{ 'OnlineRegistrationView.Validator.PinCodeInvalidCharacters' | Translate }}
</div>
modified 12-Mar-19 14:37pm.
|
|
|
|
|
I don't know what that pattern represents. Did you follow the link I gave you and look at some of the samples? The simplest patter would be \d\d\d\d .
|
|
|
|
|
Yes I did, but displaying the message depending upon the error that happens, like if invalid characters different error message, if not meeting the min length different message, any help buddy?
There is another question I have, I went into the link that you sent me, how can I get the regular expressions that I want, I tried to search using pin, pincode etc keywords, didn't help me, am I not using the link that you sent me properly buddy?
|
|
|
|
|
|
Thanks my friend, I have used two validators and depending upon that I displayed Divs with error message, I am using Type script, my Architect says not to use JavaScript.
|
|
|
|
|
Then you probably need to check the Typescript documentation. And you (and your architect) need to understand that Typescript is only Javascript with bells on. So what I already suggested will work in Typescript.
|
|
|
|
|
I know, but some leads are crazy to use specific things in specific ways, I usually try to accept defeat in the battle fields of Technology usage, I did couple of times, I got bitten by it, people in power don't like to accept the Words "no" or questions usually.
I am a contractor, so I like $$s , its OK for me to agree with him, its easier.
But thanks a lot for all your suggestions my friend.
|
|
|
|
|
Like I mentioned above, you can use the Javascript code that I already suggested.
|
|
|
|
|
Hi !
i want creat qustion script with php and jquery. but I can't fetch in database!
file quiz.php
html><pre><html>
<head>
<script>
var quiztitle = "Number";
var quiz = [
{
"question" : "$x",
"image" : "",
"choices" : ["1", "2", "3", "4"],
"correct" : "2",
"explanation" : "",
}
];
</script>
</head>
<body>
<div id="frame" role="content"></div><br/><br/>
</body>
</html>
file style.js
<pre><html>
<head>
<meta charset="utf-8">
<title>Quiz</title>
<!-- jquery for maximum compatibility -->
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
<meta name="viewport" content="width=device-width" />
<!-- Bootstrap core CSS -->
<link href="assets/css/bootstrap.min.css" rel="stylesheet" />
<link href="assets/css/paper-kit.css?v=2.1.0" rel="stylesheet" />
<!-- CSS for Demo Purpose, don't include it in your project -->
<link href="assets/css/demo.css" rel="stylesheet" />
<link href="assets/css/style.css" rel="stylesheet" />
<script src="assets/js/style.js"></script>
<!-- Fonts and icons -->
<link href='http:
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css" rel="stylesheet">
<link href="assets/css/nucleo-icons.css" rel="stylesheet" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<link href="assets/css/style.css" rel="stylesheet" />
<script src="assets/js/style.js"></script>
<?php
$con = mysqli_connect('localhost','root','','kelidestan');
if (!$con) {
die('Could not connect: ' . mysqli_error($con));
}
mysqli_select_db($con,"ajax_demo");
$sql="SELECT * FROM `question`";
$result = mysqli_query($con,$sql);
echo "<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
<th>Hometown</th>
<th>Job</th>
</tr>";
while($row = mysqli_fetch_array($result)) {
echo "<tr>";
echo "<td>" . $row['a1'] . "</td>";
echo "<td>" . $row['a2'] . "</td>";
echo "<td>" . $row['a3'] . "</td>";
echo "<td>" . $row['a4'] . "</td>";
echo "</tr>";
}
echo "</table>";
mysqli_close($con);
?>
<script>
var x = "<?php echo $row['a1'];?>"
var quiztitle = "Number";
var quiz = [
{
"question" : "$x",
"image" : "",
"choices" : ["1", "2", "3", "4"],
"correct" : "2",
"explanation" : "",
}
];
</script>
<style>
table {
width: 100%;
border-collapse: collapse;
}
table, td, th {
border: 1px solid black;
padding: 5px;
}
th {text-align: left;}
</style>
</head>
<body>
<nav class="navbar navbar-expand-md fixed-top">
<div class="container">
<div class="navbar-translate">
<button class="navbar-toggler navbar-toggler-right navbar-burger" type="button" data-toggle="collapse"
data-target="#navbarToggler" aria-controls="navbarTogglerDemo02" aria-expanded="false"
aria-label="Toggle navigation">
</button>
<a class="navbar-brand" href="index.php">2ZB.IR</a>
</div>
<div class="collapse navbar-collapse" id="navbarToggler">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" rel="tooltip" title="Follow us on Twitter" data-placement="bottom"
href="https://twitter.com/CreativeTim" target="_blank">
class="fa fa-twitter"__^Twitter</p>
</a>
</li>
<li class="nav-item">
<a class="nav-link" rel="tooltip" title="Like us on Facebook" data-placement="bottom"
href="https://www.facebook.com/CreativeTim" target="_blank">
^__i class="fa fa-facebook-square">
<p class="d-lg-none">Facebook</p>
</a>
</li>
<li class="nav-item">
<a class="nav-link" rel="tooltip" title="Follow us on Instagram" data-placement="bottom"
href="https://www.instagram.com/CreativeTimOfficial" target="_blank">
^__i class="fa fa-instagram">
<p class="d-lg-none">Instagram</p>
</a>
</li>
<li class="nav-item">
<a class="nav-link" rel="tooltip" title="Star on GitHub" data-placement="bottom"
href="https://www.github.com/CreativeTimOfficial/paper-kit" target="_blank">
^__i class="fa fa-github">
<p class="d-lg-none">GitHub</p>
</a>
</li>
<li class="nav-item">
<a href="send.php" target="_blank" class="btn btn-danger btn-round">Send Question</a>
</li>
</ul>
</div>
</div>
</nav>
<br/><br/> <br/><br/> <br/><br/>
<div id="frame" role="content"></div><br/><br/>
<?php include 'footer.php'; ?>
</body>
<!-- Core JS Files -->
<script src="assets/js/jquery-3.2.1.js" type="text/javascript"></script>
<script src="assets/js/jquery-ui-1.12.1.custom.min.js" type="text/javascript"></script>
<script src="assets/js/popper.js" type="text/javascript"></script>
<script src="assets/js/bootstrap.min.js" type="text/javascript"></script>
<!-- Switches -->
<script src="assets/js/bootstrap-switch.min.js"></script>
<!-- Plugins for Slider -->
<script src="assets/js/nouislider.js"></script>
<!-- Plugins for DateTimePicker -->
<script src="assets/js/moment.min.js"></script>
<script src="assets/js/bootstrap-datetimepicker.min.js"></script>
<!-- Paper Kit Initialization and functons -->
<script src="assets/js/paper-kit.js?v=2.1.0"></script>
</html>
i want fetching automatically by database table
|
|
|
|
|
PHP runs on the server. It has no idea what you do on the client unless you explicitly wire up a system that communicates without using postbacks, called AJAX. Your code, however, renders the page on the server and sends the whole thing down to the client when the page is refreshed.
JavaScript runs on the client. This means that it cannot use resources that only exist on the server to render on the client. For instance, trying to inject PHP tags via JavaScript can never, ever work.
Here's a whole thing about how it all works. I'm not a PHP guy, though, so I didn't vet it terribly much:
https://code.tutsplus.com/tutorials/how-to-use-ajax-in-php-and-jquery--cms-32494
"Never attribute to malice that which can be explained by stupidity."
- Hanlon's Razor
|
|
|
|
|
Hi all,
I have a typical requirement in Angular 4, a user will be given a url as below in an Email:
https://xyz.com/addanewfeature, addanewfeature is a component, which has some elements to collect extra information, like add a co-applicant etc something like that.
When user clicks, he will be redirected to a Login Page, on the login page two things can happen
1. If the user is already registered user, he can enter user id password and login, when he logs in, instead of user landing into Account Information page, he should be redirected to the addanewfeature, since he has been logged in using the url which has addanewfeature
2. If the user is not a registered user, then user can click on the register me link which opens onlineregistration page and register himself, after registration completes, page instead of landing into the account info page, it has to land into the addanewfeature page
3. Same thing if he forgot Password, he will be redirected to the Password hint page then when he enters correct information, then it will let him in and has to land into the addanewfeature page.
Any code snippet, a link or even suggestion would be greatly greatly helpful, thanks in advance my friends.
|
|
|
|
|