I am fetching data from database and post it in the form of loop.and i put delete button against every string.i want to delete one by one but when i click it deletes all.
It works fine in frontend but it removes all from database.
Here is the code and images:
<?php
$facts=explode(",",$project_data['facts']);
for($i=0;$i<sizeof($facts);$i++){
?>
<div class="margn-top-time pl-30 sct" id="">
<?php
if($project_data['facts']!=''){
?> span class="pl-5 factd" id="" maxlength="5" style="margin- left: 30px;">
<?php echo $facts[$i];
?>
</span>
<button class="btn btn-bulish rmve" id="" type="button" style="float: right;"><i
class="glyphicon glyphicon-remove"></i></button>
<?php } ?>
</div>
<?php } ?>
$(document).ready(function() {
$(document).on('click', 'button.rmve', function() {
$(this).closest('div.sct').remove();
});
});
I have no clue so if anyone have solution then please tell me
Related
I have an html table with bootstrap styling, and in the right side I have checkboxes in each row, but when I select them and click 'Write Report' button it doesn't go to next page, it doesn't do anything as if I didn't click anywhere.
I am new to all this HTML, Bootstrap and PHP so probably there is a stupid mistake I am making somewhere.
Here is my table:
<table id="usetTable" class="display compact" data-toggle="table" data-classes="table table-hover table-condensed" data-row-style="rowColors" data-striped="true" data-sort-name="Quality" data-sort-order="desc" data-pagination="true" data-click-to-select="true">
<thead>
<th data-field="state" data-checkbox="true">Dev.no</th>
<th>IMEI</th>
<th>Report comment</th>
</thead>
<tbody>
<form method="post">
<?php if (!empty($devices)) { ?>
<?php foreach ($devices as $device) : ?>
<tr id="tr-id-2" class="tr-class-2">
<td>
<input type="checkbox" name="devices[<?php echo $device["id"] ?>]" value="<?php echo $device["id"] . $dev_comment ?>">
<?php echo $device["device_no"] ?>
</td>
<td>
<?php echo $device["serial_imei"] ?>
</td>
<td>
<div class="input-group">
<textarea name="dev_comment[<?php echo $device["id"] ?>]" placeholder="comment" rows="1" cols="50"><?php echo $dev_comment; ?></textarea>
</div>
</td>
</tr>
<?php endforeach; ?>
<?php } ?>
</br>
<div id="wrapper">
<button class="btn" type="submit" name="report">Write report</button>
</div>
</form>
</tbody>
</table>
</div>
<script>
$(document).ready(function() {
$('#usetTable').DataTable();
});
</script>
I tried to post only the minimal code to reproduce this error even though I am using dynamic data so its kinda difficult to reproduce this way but in case you want to do that, just user hardcoded data in the table and remove the array fields.
P.S. the table is looking perfectly fine, the only problem is with selecting the rows and going to next page.
[Here is a screenshot][1] [1]: https://i.stack.imgur.com/IidBA.png
EDIT:
I am using jQuery function now and it works but the table lost pagination:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
$(document).ready(function() {
$('#usetTable').DataTable();
$(function() {
//Assign Click event to Button.
$("#btnGet").click(function() {
//Loop through all checked CheckBoxes in GridView.
$("#usetTable input[type=checkbox]:checked").each(function() {
var row = $(this).closest("tr")[0];
});
});
});
});
</script>
if I remove this: src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"
the table looks good but checkboxes dont work anymore.
i want to get images that i fetched from database in my page and show them again in div with id test by ajax i want to show fetched datas again in div with test id when i click on button with addCart class . i think i haveto get value of button that i set it to ids of products in my datbase . and my problem is how can i get id s in ajax code?
$(document).ready(function(){
$(".addCart").click(function(){
$.post(".addCart.val()",function(data){
$("#test").html(data).show();
});
});
});
<div id="test" style="background-color: grey"></div>
<?php while ($row = mysqli_fetch_array($products)):?>
<div class="span3">
<div class="product">
<div class="product-img">
<div class="picture">
<img src="images/<?php echo $row['image'] ?>" alt="" width="540" height="374" />
<div class="img-overlay">
توضیحات بیشتر
<button value="<?php echo $row['id']?>" class="btn buy btn-danger addCart">اضافه به سبد خرید</button>
</div>
</div>
</div>
<div class="main-titles no-margin">
<h4 class="title"><?php echo $row['price'] ?></h4>
<!--<h5 class="no-margin">محصول ویژه 434</h5>-->
</div>
<p class="desc"><?php echo $row['name']?></p>
<p class="center-align stars">
<span class="icon-star stars-clr"></span>
<span class="icon-star stars-clr"></span>
<span class="icon-star"></span>
<span class="icon-star"></span>
<span class="icon-star"></span>
</p>
</div>
</div> <!-- /product -->
<?php endwhile;?>
$(".addCart").click(function(event){
var id = event.target.val();
});
This will get an value of your button element. But is this id is a valid url to make a ajax call? I dont think so. Please checkout Jquery Docs before returning to work on this part of functionality
in your code you are not passing correct value to php file
please do correction in your code
$(document).ready(function(){
$(".addCart").click(function(){
var jq = $(this);
var cart_id = jq.val(); /* get cart value */
$.post("ajax.php",{cart_id:cart_id},function(data){
$("#test").html(data).show();
});
});
});
and fetch cart_id in php ajax.php file like this
<?php
if(isset($_POST['cart_id'])){
/* put your code here */
}
?>
Ok guys already search for it but no results at all, and cant figured it out how to do this, so my problem is:
I have this form:
<form method="POST" action="search.php" name="form" id="form">
<input type="text" name="search" id="search" placeholder="Introduza a sua Localização">
<input type="submit" name="Submit" value="Pesquisar">
</form>
And what i would like to is when i press this:
<a onClick="">City</a>
The input value change to what i want in this case "City" and then automatically submit the form.
I already made a research about this and theres nothing i could take, any help would be appreciated.
Cumps.
Guys thanks to your help now its working but someone tell me please what the problem in this code:
<?php if (mysql_num_rows($tournaments) !=0){
do { ?>
<div id="mainContainer">
<div id="leftContainer"><img src="images/tournaments/<?php echo $row_tournaments['logo']; ?>.png"></div>
<div id="rightContainer">
<div id="rightContent">
<p><?php echo $row_tournaments['description']; ?></p>
<div id="galleryButton"><p>Entrar no torneio</p></div>
</div>
<div id="rightDetails">
<i class="fa fa-gamepad"></i> <?php echo $row_tournaments['game']; ?><br>
<i class="fa fa-calendar-o"></i> <?php echo $row_tournaments['date']; ?><br>
<i class="fa fa-pencil-square-o"></i> Sem comentários<br>
<script type="text/javascript">
function giveThatInputAValue(){
var elem = document.getElementById("search");
elem.value = "<?php echo $row_tournaments['city']; ?>";
/*document.forms["form"].submit();
*/}
</script>
<i class="fa fa-map-marker"></i> <a onClick="giveThatInputAValue()"><?php echo $row_tournaments['city']; ?></a><br>
<img src="images/<?php echo $row_tournaments['online']; ?>.png"> <?php echo $row_tournaments['online']; ?>
</div>
</div>
</div>
<?php } while ($row_tournaments = mysql_fetch_assoc($tournaments));
} else {
?>
<div id="noresults"><p>Sem torneios</p></div>
<?php
}
?>
Everything is looped fine but that part:
<script type="text/javascript">
function giveThatInputAValue(){
var elem = document.getElementById("search");
elem.value = "<?php echo $row_tournaments['city']; ?>";
/*document.forms["form"].submit();
*/}
</script>
Its not looping it only shows the first record why is it?
Any help would be appreciated.
in your js file you can check if the value of the textbox is equal to the cityname you want. if it is then submit the form. Attach the function to your a tag
function SubmitRightCity(){
if(document.getElementById('search').value == "citynamehere"){
document.forms["form"].submit();
}
}
in html
<a onClick="submitRightCity()">City</a>
In the case where you want your a tag to give the input a value, you attach a function to your tag, once the link is clicked, then the function will give your input a value.
<a onClick="giveThatInputAValue()"> City</a>
in javascript file you will have
<script>
function giveThatInputAValue(){
var elem = document.getElementById("search");
elem.value = "My city value";
//if you want to submit the form right after, you add the line below
document.forms["form"].submit();
}
</script>
All the other attribute changes seem to work fine inside the modal. The rating button inside the modal doesn't load its value on loading. But the inspect element seems to display the proper rating value.
I am new to php and jquery. Kindly excuse me from silly programming methodologies implemented in the above mentioned code.
Any help would be deeply appreciated.
HTML :
<div class="item" style="width: 400px; height: 230px">
<!-- Link trigger modal -->
<a data-img-url="upload/<?php echo $row['image_name'] ?>" data-toggle=
"modal" href="#myModal" id="<?php echo $row['image_id'] ?>" onclick=
"modalload(this.id, '<?php echo $row['image_title'] ?>' , '<?php echo $row['image_description'] ?>', <?php echo $TAVG ?> );"><img class="img-responsive carousal_scale"
src="upload/%3C?php%20echo%20$row['image_name']%20?%3E"></a>
<div class="carousel-caption">
<p><?php echo $row['image_title'] ?></p>
</div>
</div><!-- Modal -->
<div class="modal fade modal-dialog modal-content" id="myModal" tabindex="-1">
<div class="modal-header">
<button class="close" data-dismiss="modal" type=
"button"><span>×</span><span class="sr-only">Close</span></button>
<h2 class="modal-title" id="myModalLabel"></h2>
</div>
<div class="modal-body well">
<img class="img-responsive carousal_scale" src=""> <input class="rating"
data-size="xs" id="" max="5" min="0" onchange="test(this.id, this.value);"
step="0.1" style="alignment-adjust: auto;" type="number" value="">
</div>
<div>
<p style="text-align: center; font-size: 15px;"></p>
</div>
<div class="modal-footer">
<button class="btn btn-default" data-dismiss="modal" type=
"button">Close</button>
</div>
</div>
JS :
$(document).ready(function() {
$(".rating-kv").rating();
});
function modalload(id, title, description, avg) {
alert(avg);
// alert(description);
$('#myModal img').attr('src', $('#' + id).attr('data-img-url'));
$('#myModal input').attr('value', avg);
$('#myModal input').attr('id', id);
$('#myModal h2').text(title);
$('#myModal p').text(description);
}
function test(id, val) {
var pic_id = id;
var pic_val = val;
$.ajax({
type: 'POST',
url: 'rating.php',
data: {
'pic_id': pic_id,
'pic_val': pic_val
},
}).done(function(data) {
// alert(data);
});
}
"The rating button inside the modal doesn't load its value on loading." You currently have your modalload()function only activate on click of an a tag so your rating isn't going to get it's value/id populated on load, but rather on click.
Try this instead inside your modalload() function,
$('.rating').attr('value', avg);
$('.rating').attr('id', id);
Also, note that there is no jQuery rating() function, and that you have no element with the class rating-kv in your HTML, therefore the below code will do nothing.
$(".rating-kv").rating();
In other words, you have a lot of bad coding practices and incomplete code. You should consider revising what you have and re posting it.
I am new to ajax, is there a way you can help me, how to disable all items once click is successful:
Here is my code for ajax:
if (!parent.hasClass('.disabled')) {
// vote up action
if (action == 'click') {
alert("test");
};
//how do i add disabled function on a particular div
// add disabled class with .item
parent.addClass('.disabled');
};
here is my index:
<?php while($row = mysql_fetch_array($query)): ?>
<div class="item" data-postid="<?php echo $row['recipe_id'] ?>" data-score="<?php echo $row['vote'] ?>">
<div class="vote-span"><!-- voting-->
<div class="vote" data-action="up" title="Vote up">
<i class="icon-chevron-up"></i>
</div><!--vote up-->
<div class="vote-score"><?php echo $row['vote'] ?></div>
</div>
<div class="post"><!-- post data -->
<p><?php echo $row['recipe_title'] ?></p>
</div>
</div><!--item-->
i jst want to disable the loop icon-chevron-up class.not just one but all.
Actually no ajax call needed here. I will only be done by using jquery. See the code
$(document).ready(function(){
$('.item').click(function(){
if (!parent.hasClass('.disabled')) {
parent.addClass('.disabled');
}
});
});
Here you have not mentioned, on what click you need the action, so i consider that on the div contains class='item', the action will be performed. I hope it will help.