Is there other ways to select classes with same name but in different table rows?
I use html class="className + id" Than in jquery to select $('.className'+id)... some code
I would like to avoid using the id each time. Some suggestions?
Thank you
HMTL
Data retrieved from the database
<tr class="row" id="<?= $id;?>"> <!-- id 1 -->
<td class="atyp<?= $id;?>"> <?= $v['atyp'];?> </td>
<tr class="row" id="<?= $id;?>"> <!-- id 2 -->
<td class="atyp<?= $id;?>"> <?= $v['atyp'];?> </td>
JQUERY
<script>
$('.atyp'+id).val() // some code....
</script>
So the table has multiple rows with same class name and I would like to avoid to use id to select a specific class
Don't put <?= $id;?> to your classes:
<tr class="row" id="<?= $id;?>"> <!-- id 1 -->
<td class="atyp atyp<?= $id;?>"> <?= $v['atyp'];?> </td>
<tr class="row" id="<?= $id;?>"> <!-- id 2 -->
<td class="atyp atyp<?= $id;?>"> <?= $v['atyp'];?> </td>
$('.atyp').val()
You should not give multiple HTML elements the same ID.
You can select the first td with the :first-of-type selector
$("td:first-of-type")
In general you can use the :nth-of-type selector.
$("td:nth-of-type(42)")
Related
I am working on a website where I am getting input of semester number from the user and I want to display the subjects in the semester they entered accordingly.
For this, I planned to create tables for each semester which would have the subjects in it.
For now, I am successful to retrieve data from one table. But I am required to get subjects as per the entered semester by the student.
Following is the code,which works perfectly for semester 5. Please suggest alterations as per the requirements asked above.
<!DOCTYPE html>
<html>
<head>
<title></title>
<!-- very important -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="subject.css">
</head>
<body>
<h1 class="text-center text-capitalize font-weight-bold">Subject Information</h1>
<div class="container">
<div>
<br>
<div>
<form class="form-inline">
<!-- <div class="mx-auto" style="width: 200px;"> -->
<div class="form-group">
<label for="Sem"> Semester: </label>
<div>
<input type="text" name="sem_no" placeholder="Enter current semester" id=sem class="form-control">
</div>
<br>
</div>
</form>
</div>
</div>
</div>
<div>
<!-- TABLE DISPLAYED WITH DATA FROM RESPECTIVE DATABASE -->
<div class= "container">
<div class="col-lg-12 ">
<br><br>
<h2 class="text-center">Subjects</h2>
<table class="table table-striped table-hover table-bordered">
<tr>
<th>Subject code</th>
<th>Subject Name</th>
<th>Faculty name</th>
</tr>
<?php
$con = mysqli_connect('localhost','root');
mysqli_select_db($con,'subjects');
$q= "select * from sem5";
$query = mysqli_query($con,$q);
while($res = mysqli_fetch_array($query))
{
?>
<tr>
<td><?php echo $res['subject_no']; ?></td>
<td><?php echo $res['subject_name']; ?></td>
<td><?php echo $res['faculty_name']; ?></td>
</tr>
<?php
}
?>
</table>
</div>
</div>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</body>
</html>
Please suggest alterations. Will be highly obliged.
You need to do a HTTP GET request and use PHP to get the value. Then use PHP to make the SQL query. Here it is in its simplest form.
I've added a submit button which submits the form and executes the HTTP GET with the parameters attached to the URL. You will see ?sem_no=x after it is submitted. That's the Query String.
...
...
<div class="form-group">
<label for="Sem"> Semester: </label>
<div>
<input type="text" name="sem_no" placeholder="Enter current semester" id=sem class="form-control">
</div>
<div>
<input type="submit"/>
</div>
<br>
...
...
...
...
//check the value was submitted and it is not blank
<?php if(isset($_GET['sem_no']) && !empty($_GET['sem_no'])) { ?>
<!-- TABLE DISPLAYED WITH DATA FROM RESPECTIVE DATABASE -->
<div class= "container">
<div class="col-lg-12 ">
<br><br>
<h2 class="text-center">Subjects</h2>
<table class="table table-striped table-hover table-bordered">
<tr>
<th>Subject code</th>
<th>Subject Name</th>
<th>Faculty name</th>
</tr>
<?php
$con = mysqli_connect('localhost','root');
mysqli_select_db($con,'subjects');
$q= 'select * from sem'.$_GET['sem_no'];
$query = mysqli_query($con,$q);
while($res = mysqli_fetch_array($query))
{
?>
<tr>
<td><?php echo $res['subject_no']; ?></td>
<td><?php echo $res['subject_name']; ?></td>
<td><?php echo $res['faculty_name']; ?></td>
</tr>
<?php
}
?>
</table>
</div>
</div>
<?php
//closing if
} ?>
...
...
As mentioned in the comments earlier, this database design is quite poor. I know you are learning though. Have you considered having a subjects table that has a Semester column? Then you could do a query like:
SELECT * FROM subjects where semester_number = x
There are even better ways to do it beyond that but this would be a good starting point for you.
first of all I want to clarify that I have read the suggestions but I did not find an exact answer.
I want to make a database locally by saving in this parts of a html page code, and I'm going to use it locally only, i use Wampsever 3.
I want to make a page in a local in which I can paste HTML code and parts of this code are saved in a database, the code is dynamically generated so I think it has no error, and always i will paste a DIV element with a TABLE with ROWS.
The code is something like this:
<div>
<table>
<tbody>
<tr class="month">
<td colspan="5">Jan</td>
</tr>
<tr class="day-info">
<p>xxx</p>
</tr>
<tr class="dataofday">
<div class="info1">
<p>yyy</p>
</div>
<div class="info2">
<p>zzz</p>
</div>
</tr>
<tr class="day-info">
<p>xxx</p>
</tr>
<tr class="dataofday">
<div class="info1">
<p>yyy</p>
</div>
<div class="info2">
<p>zzz</p>
</div>
</tr>
<tr class="month">
<td colspan="5">Feb</td>
</tr>
<tr class="day-info">
<p>xxx</p>
</tr>
<tr class="dataofday">
<div class="info1">
<p>yyy</p>
</div>
<div class="info2">
<p>zzz</p>
</div>
</tr>
<tr class="day-info">
<p>xxx</p>
</tr>
<tr class="dataofday">
<div class="info1">
<p>yyy</p>
</div>
<div class="info2">
<p>zzz</p>
</div>
</tr>
</tbody>
</table>
</div>
And i need to save in a database the rows with classes "day-info" and class="dataofday", both in the same row of a table in a a database but in different cells.
I can create the database, i can get the elements with Jquery or Javascript but i do know how can i save the data in a database from a page in local where i can paste the DIV with the data.
So i need some help for create it and save the data to a DB.
Am i rigth if my first step is to create a .html or .php file into a virtual host in Wampserver with a code like this:
<html>
<head>
</head>
<body>
<textarea rows="40" cols="100">
...Here paste the data.
</textarea>
</body>
</html>
and maybe with new DOMDocument i can get the data, parse it and save it to th database.
hotels_data table
hotel_rooms table
MYSQL QUERY
$pdo = $dbo->prepare('SELECT distinct hotels_data.*, hotel_rooms.hid, hotel_rooms.room_name, hotel_rooms.price
FROM hotels_data
LEFT OUTER JOIN hotel_rooms
ON hotels_data.hotel_id = hotel_rooms.hid
');
OUTPUTING THE DATA
i loop the Hotel rooms
$row = $pdo->fetchAll(PDO::FETCH_OBJ);
foreach($row as $rows){
print '
<!-- Listing -->
<div class="list_hotels_box">
<ul class="list_hotels_ul">
<li style="display:block;">
<img src="../img/hotel_img.png" alt="" style="width: 180px; height:180px;"/>
</li>
<li style="width: 100%;">
<h3 class="clear-top">'.$rows->hotel_name.'<span><?php print $star; ?></span></h3>
<p>'.$rows->hotel_address.', '.$rows->hotel_state.''.$rows->hotel_country.' </p>
<div id="rooms">
<p>
<table class="table table-condensed table-striped table-hover table-bordered">
';
foreach($row as $td){
if($td->hotel_id == $rows->hid){
print
'
<tr>
<td>'.$td->room_name.'</td>
<td align="right" style="color: darkorange;"><strong><sup>RM</sup>'.$td->price.'</strong></td>
</tr>
';
};
} ;
print '
<tr>
<td colspan="2">See All Rooms</td>
</tr>
</table>
</p>
</div>
</li>
<div align="right">
<li>
<h4><small>Rating</small> <strong>8.5</strong></h4>
<span class="help-block clear">"0" Reviews</span>
<button onclick="alert(\'Not operational yet\')" class="btn btn-sm btn-info">Book Now</button>
</li>
</div>
</ul>
</div>
<!-- Listing -->
';
Here is the output
i have Hotel Sample & Hotel Sample 2 but Hotel Sample has outputted 2
i think its bcoz of the 2 rooms
so my problem is how do i remove the duplicate data
Please assist me. TQ
sorry if i didn't make myself very clear
One way would be to simply split to 2 queries, like:
SELECT * FROM hotels_data;
And then rooms query inside your hotels loop:
SELECT hid, room_name, price FROM hotel_rooms WHERE hid = :hotel_id
This assumes you are using binded parameters and bind the $rows->hotel_id to :hotel_id parameter.
You could also use GROUP BY hotel_id, but then you won't get all the rooms for your hotels, unless you use GROUP_CONCAT() and parse the concatenated rooms values.
I'm running into a strange scenario involving a widget and the lay-out. I've created a layout that overrides the original column 2 lay-out. It calls a widget in the file and in that widget display a table on the side-bar of some information that I would like to show the user. The layout sidetable.php looks like this
<?php $this->beginContent('//layouts/main'); ?>
<div class="row-fluid">
<div class="span3">
<?php
$this->widget('ListSummaryWidget', array('totaldue'=>$totaldue));
?>
<table class="table">
</table>
</div><!-- sidebar span3 -->
<div class="span9">
<div class="main">
<?php echo $content; ?>
</div><!-- content -->
</div>
</div>
<?php $this->endContent(); ?>
Now all this works - displaying a datatable on the left hand column of the screen. However, something strange happens. Whenever I git rid of
<table class="table">
</table>
The whole view breaks - showing a ridiculous structure/layout that doesn't look much at all like the original. This is confusing/intriguing. In my widget I declare the exact same table and yet it does not seem to matter that I declare this table. Here is the code for my widget's view
<table class="table list_summary table-bordered">
<form action="<?php echo Yii::app()->createUrl('recipient/processpayment', array('id'=>$id)) ?>" method="post" >
<tr class="primary"><td> <h4>List Summary </h4> </td></tr>
<tr ><td>
<?php echo $numpeople; ?> Recipient(s)
</td></tr>
<tr ><td>
Total Due: <?php echo $totaldue ?> Rwf
</td></tr>
<tr> <td>
<h4> Mobile Money Accounts: </h4>
<?php
/*
foreach($accounts as $account)
{
echo $account->name; ?>: <?php echo $account->balance; ?> Rwf<br> <?php
}
*/
?>
</td> </tr>
<tr> <td>
<button class="btn btn-block btn-primary " type="submit">Pay Now</button> </td> </tr>
</td></tr>
</form>
Could anyone explain why this is happening? Though it's not the worst thing in the world - I'm really intrigued as to why I'm required to have some html when I have the same html in the widget's view.
Resolved:
I didn't end the table in my widget. I should have added at the end
</table>
I have a little problem with my PHP while loop. I am looping out all the available membership packages (and it's details) from my database.
My code is like this:
<?php
while($mp = mysql_fetch_assoc($s)):
?>
<tr class="hover">
<td class="name" width="30%"><?php echo $mp['membershipname']; ?></td>
<td class="price" width="30%">$<span><?php echo $mp['ap_price']; ?></span>/<span><?php echo $mp['duration']; ?></span> days.</td>
<?php if($userdata['membership']>$mp['membershipid']): ?>
<td width="40%" class="purchase"></td>
<?php else: ?>
<td width="40%" class="purchase" >
Pricing
</tr>
<?php endif; ?>
<div style='display:none'>
<div id='inline_content' style='padding:10px; background:#fff;'>
<div style="text-align:center;font-weight:bold">Please select your payment method:</div>
<div style="text-align:center">
<br />
<?php
if($sdata['allow_paypal'] == 1 && $mp['pp_price']>0 && $userdata['paypal']!=""): ?>
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" style="float:left;" >
<input type="submit" name="submit" class="click cblue" value="PayPal - $<?php echo $mp['pp_price']; ?>">
</form>
<?php endif;
if($sdata['allow_alertpay'] == 1 && $mp['ap_price']>0 && $userdata['alertpay']!=""):
//Do not change any input fields, OTHER than return URL (if needed)
?>
<form method="post" name="ap" action="https://www.alertpay.com/PayProcess.aspx" style="float:right;" >
<input type="submit" name="submit" class="click cgreen" value="AlertPay - $<?php echo $mp['ap_price']; ?>" />
</form>
<?php
endif; ?>
</div>
</div>
</div>
<script>
$(document).ready(function(){
$("#upg<?php echo $mp['id']; ?>").colorbox({inline:true, width:"30%",href:"#inline_content"});
});
</script>
<?php endwhile; ?>
As you can see in the above code, I am doing a while loop.
My problem is that the $mp['pp/ap_price'] inside the #inline_content is not looping. It only take the price from the first row. Although, it is looping in the table.
What's the issue here? I tried to do another loop inside the #inline_content, but it didn't work.
HTML IDs should be unique to one DOM element.
You have a DOM element #inline_content for every record in your database query result. Then, when you try to use Javascript to display them all, only one is displayed because they all have the same ID.
HTML and Javascript are not aware of your PHP loop.
Consider using a class attribute instead of an id attribute.