I have the following code:
#foreach($results as $result)
<tr>
<td>{{$result->my_id}}</td>
<td>{{$result->province_name}}</td>
<td>{{$result->city_name}}</td>
<td>
<a class="btn btn-primary" href="{{route('city-edit', $result->my_id)}}"><i class="fa fa-edit"></i></a>
<a class="btn btn-danger" href="{{route('city-delete', $result->my_id)}}"><i class="fa fa-trash"></i></a>
</td>
</tr>
#endforeach
How to add a confirmation on delete each data?
I prefer a more easier way, just add onclick="return confirm('Are you sure?')", as bellow:
<a class="btn btn-danger" onclick="return confirm('Are you sure?')" href="{{route('city-delete', $result->my_id)}}"><i class="fa fa-trash"></i></a>
If this is your link:
Delete
Use this Javascript:
var deleteLinks = document.querySelectorAll('.delete');
for (var i = 0; i < deleteLinks.length; i++) {
deleteLinks[i].addEventListener('click', function(event) {
event.preventDefault();
var choice = confirm(this.getAttribute('data-confirm'));
if (choice) {
window.location.href = this.getAttribute('href');
}
});
}
Note: the <a> needs the delete in class.
This solution uses Unobtrusive JavaScript and should work with IE 9 or newer.
<a class="btn btn-danger" onclick="return myFunction();" href="{{route('city-delete', $result->my_id)}}"><i class="fa fa-trash"></i></a>
<script>
function myFunction() {
if(!confirm("Are You Sure to delete this"))
event.preventDefault();
}
</script>
<a href="{{ route('city-delete', $result->my_id) }}"
class="btn btn-danger" data-method="DELETE" data-confirm="Are you sure?"> Delete</a>
With brexis/laravel-data-method package, you can specify appropriate HTTP method and a confirmation text.
This is helpful if you have this for example into your routes file:
Route::get('cities/{city}', 'CityController#show')->name('city-show');
Route::delete('cities/{city}', 'CityController#destroy')->name('city-delete');
If this is your link:
<i class="fa fa-trash"></i>
Route:
Route::get('/icrm/venues/property_area/delete/{propertyarea}', 'VenuePropertyAreaController#deletepropertyarea')->name('venuepropertyarea.delete');
Use this Javascript:
var deleteLinks = document.querySelectorAll('.delete');
for (var i = 0; i < deleteLinks.length; i++) {
deleteLinks[i].addEventListener('click', function(event) {
event.preventDefault();
var choice = confirm(this.getAttribute('data-confirm'));
if (choice) {
window.location.href = this.getAttribute('href');
}
});
}
Note: the <a> needs the delete in class.
This solution uses Unobtrusive JavaScript and should work with IE 9 or newer.
index.blade.php
<form action="{{route('todos.destroy', $todo->Id)}}" method="post">
<input type="hidden" name="_method" value="DELETE">
#csrf
<button id="btnDelete"class="btn btn-danger btn-sm">Delete</button>
</form>
<script type="javascript">
document.onsubmit=function(){
return confirm('Sure?');
}
</script>
I used pure PHP Form, the method DELETE has to be passed as hidden on the submit page action, so I catch it trough javascript and I get the confirmation alert.
<a class="btn btn-danger px-5 radius-30" onclick="return confirm('Are you sure you want to Unassign this agent?')" href="{{ route('unassign.agent', $report->id) }}" >Unassign</a>
the right route method
Related
I'm trying to make a simple form for insert, delete, update using localStorage to store my data. When I click Add button, It shows an error
TypeError: $scope.lstLaptop.push is not a function.
I was back to my code and check syntax if I'm wrong, but I think my code was only 3 lines and look usual. Can you tell me what I was missing something or what the problem really was from?
Just ignored my other code and check my controller lapCreateUpdateCtrl please, I'm out of idea what I'm wrong.
HTML file:
<div class="container">
<table class="table table-hover">
<tr>
<th>Laptop Model</th>
<th>Price($)</th>
<th>Option</th>
</tr>
<tr ng-repeat = "laptops in lstLaptop track by $index">
<td><p ng-bind = laptops.model></p></td>
<td><p ng-bind = laptops.price></p></td>
<td><button type="button" ng-click="remove1($index)"
class="btn btn-danger btn-xs">
Delete
</button>
<button type="button" ng-click="edit1($index)"
class="btn btn-warning btn-xs">
Edit
</button>
<button type="button" ng-click="update1($index)"
class="btn btn-info btn-xs">
Update
</button>
</td>
</tr>
</table>
<button type="button" class="btn btn-success btn-sm"
ng-click="save()">
Save
</button>
</div>
</div>
</body>
app.JS file:
routerApp.controller('lapCreateUpdateCtrl', ["$scope", function($scope){
$scope.laptop = {};
$scope.lstLaptop = [];
function init(){
var strLaptop = window.localStorage.getItem("LAPTOP_KEY");
if(strLaptop){
$scope.lstLaptop = JSON.parse(strLaptop);
}
}
init();
$scope.add1 = function(){
$scope.lstLaptop.push($scope.laptop);
$scope.laptop = {};
}
$scope.remove1 = function(index){
$scope.lstLaptop.splice(index,1);
alert("Deleted!");
}
$scope.edit1 = function(index){
$scope.laptop = angular.copy($scope.lstLaptop[index]);
}
$scope.update1 = function(index){
$scope.lstLaptop.splice(index, 1, $scope.laptop);
$scope.laptop = {};
}
$scope.save=function(){
window.localStorage.setItem("LAPTOP_KEY", JSON.stringify($scope.lstLaptop));
}
}]);
I want content input from textbox
<input type="text" ng-model="laptop.model" id="model" name="model"
placeholder="Model" required />
<input type="number" ng-model="laptop.price" id="price" name="price"
placeholder="Price" required />
<button type="button" ng-click="add()">
Add Desktop
</button>
You have called init() and then inside that function, you have changed the $scope.lstLaptop to an object. When $scope.add1 will be called, it will throw an error as object does not have push function. It only works with Arrays.
I don't understand what you want to achieve, but you can do something like below. It will retain the lstLaptop as array
function init(){
var strLaptop = window.localStorage.getItem("LAPTOP_KEY");
if(strLaptop){
$scope.lstLaptop.push(JSON.parse(strLaptop));
}
}
hope all be will. I face to like this problem anyone can help me.
I get the value of dropdown and I put it to input, but I am unable to search it.
I used from jQuery to get the value from bootstrap dropdown to give for input.
<!-- HTML Code With Form -->
<!-- Basic dropdown -->
<form method="post" enctype="multipart/form-data" action="team.php"
class="form-inline active-purple-3 active-purple-4" style="width:400px;
margin-top:-50px; margin-left:125px; ">
<button id="sb" class="btn btn-primary dropdown-toggle mr-4" type="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
style="margin-top:20px; margin-left:-140px;">Search By</button>
<div class="dropdown-menu" id="dm" style="margin-left:89px; margin-
top:-963px;">
<a class="dropdown-item" id="dl" href="#" value="ID">BY ID</a>
<a class="dropdown-item" id="dl" href="#" value="Name">Name</a>
<a class="dropdown-item" id="dl" href="#" value="Positon">Position</a>
</div>
<input type='hidden' name='thenumbers'>
<!-- Basic dropdown -->
<!-- Search form -->
<i class="fa fa-search" aria-hidden="true" style="margin-top:15px;"></i>
<input name="txtSearch" class="form-control form-control-sm ml-3 w-75"
id="in" type="text" placeholder="Search" style=" margin-top:15px; border-
radius:5px 5px 5px 5px;" aria-label="Search">
<button type="Submit" name="searchrec" class="btn btn-primary"
style="margin-left:365px; margin-top:-55px;">Search</button>
</form>
<!-- jQuery Code -->
<script>
$(document).ready(function(){
$('#dm a').on('click', function(){
$('#sb').text($(this).text());
});
});
</script>
<script>
$(function(){
//Listen for a click on any of the dropdown items
$("#dm a").click(function(){
//Get the value
var value = $(this).text();
//Put the retrieved value into the hidden input
$("input[name='thenumbers']").val(value);
});
});
</script>
<!-- jQuery Code End -->
<!-- PHP Code -->
<?php
include "Config.php";
if(isset($_POST['searchrec']))
{
$txtSearch=$_POST['txtSearch'];
$column=$_POST['thenumbers'];
if($column == "BY ID")
{
$query1="SELECT * FROM ourteam WHERE id LIKE '%$txtSearch%'";
$result1=mysqli_query($db,$query1);
$count=mysqli_num_rows($result1);
if($count == 0)
{
}else{
while($rowr=mysqli_fetch_array($result1))
{
$id=$rowr['id'];
$name=$rowr['name'];
echo "<script>alert($name);</script>";
}
}
This PHP code is just for ID and I used elesif statement also for other entities.
First, get the values not the text:
//Get the value
var value = $(this).attr('value'); // instead of text
Then, map it on the server side
$allowed_columns = ['id', 'name', 'position'];
$column = $_POST['thenumbers'];
$txtSearch = $_POST['txtSearch'];
// Check the field name
if (!in_array($column, $allowed_columns)) {
// Throw some exception, or do whatever you want
}
// Sanitize the value
$txtSearch = mysqli_real_escape_string($txtSearch);
$query1="SELECT * FROM ourteam WHERE `$column` LIKE '%$txtSearch%'";
// ...
this is my script in a blade page :
function manageRow(data) {
//alert('inside row'+data);
var rows = '';
$.each( data, function( key, value ) {
if(value.user_id=={{Auth::user()->id}}){
getcomment(value.id);
rows+='<div class="post"><div class="user-block">#if($user->sex=='female' && $all->avatar=='default.jpg')<img class="img-responsive img-bordered-sm" src="public/theme/dist/img/default1.jpg" alt="user image">#else<img class="img-responsive img-bordered-sm" src="public/theme/dist/img/{{$all->avatar}}" alt="user image">#endif<span class="username">{{$all->username}}<i class="fa fa-times"></i><p style="font-size: 10px"><i class="fa fa-clock-o" aria-hidden="true"></i> '+value.created_at+'</p></span></div><p>'+value.status+'</p><ul class="list-inline"><li><i class="fa fa-thumbs-o-up margin-r-5"></i> Like</li><li ><i class="fa fa-comments-o margin-r-5"></i> Comments(5)</li></ul><div><form action="{{route('post_comment.store')}}" method="post"><input type="hidden" id="post_id" name="post_id" value="'+value.id+'"><input type="hidden" name="_token" value="{{ csrf_token() }}"><div class="input-group"><input class="form-control input-sm" name="comment" type="text" placeholder="Type a comment"><span class="input-group-btn"><button class="btn btn-secondary btn-sm comment-btn2" type="submit"><i class="fa fa-send"></i></button></span></div></form></div><div class="all-comments"></div></div>';
}
});
$("#status-id").html(rows);
}
function getcomment(id){
$(".all-comments").html('<p>awlad</p>');
}
i want to set this html into the rows above
but it prints undefinied instead of awlad..
anyone please help
You're trying to append value to element all-comments when it's not created yet :
rows+='<div class="post"><div class="user-block">....';
getcomment(value.id);
Hope this helps.
I don't think the html you are creating will work. You are inserting some blade syntax, but at that time the blade file has already been parsed
i want to create unique id in each click of button using Jquery.Actually i am creating file field by clicking on a button here i need first file field's id will remain constant(i.e-fileid) as it is when user will click on a button and the next file field will created the id will change(i.d-fileid1) and so on.I am explaining my code below.
<div class="col-md-6 bannerimagefile bmargindiv1">
<label for="expcerti" accesskey="B"><span class="required">*</span> Publication/Papers Upload your publication/papers certificate.</label>
<ol id="expOl">
<li>
<div class="totalaligndiv">
<div class="col-md-10 padding-zero bannerimagefilenew bmargindiv1">
<input type="file" class="filestyle" data-size="lg" name="expcerti" id="expcerti" />
</div><div class="col-md-2 padding-zero bmargindiv1">
<button type="button" class="btn btn-success btn-sm " id="Expadd">+</button>
<button type="button" class="btn btn-danger btn-sm" id="Expminus" style="display:none;" >-</button>
</div>
<div class="clearfix"></div>
</div>
</li>
</ol>
</div>
<script>
$(document).ready(function () {
$(document).on('click','.btn-success', function () {
// var i=1;
$.getScript("js/bootstrap-filestyle.min.js");
$('#expOl').append("<li><div class='totalaligndiv'><div class='col-md-10 padding-zero bannerimagefilenew bmargindiv1'><input type='file' class='filestyle' data-size='lg' name='expcerti' ></div><div class='col-md-2 padding-zero bmargindiv1'><button type='button' class='btn btn-success btn-sm ' id='Expadd'>+</button><button type='button' class='btn btn-danger btn-sm' id='minus' style='display:none'>-</button></div><div class='clearfix'></div></div></li>");
// $('.filestyle').attr("id","expcerti"+i);
$(this).css('display', 'none');
$(this).siblings("button.btn-danger").css('display', 'block');
// i++;
});
$(document).on('click','.btn-danger', function () {
console.log('delete');
$(this).closest("li").remove();
});
});
</script>
Check my above code first file field's id is expcerti,when one new will be created it should be expcerti1 and like this it will increment .so that if i have 5 filed i can add 5 file in their respective field.But in my case if i have more file field all file is appending one file field. Please help me to resolve this issue.
To generate a new ID on every click maintain a counter flag.
Let's say var i = 1;
Increment this counter on every click i++.
Use this counter variable with id attribute.
Have modified your code snippet as below:
$(document).ready(function () {
var i=1;
$(document).on('click','.btn-success', function () {
$.getScript("js/bootstrap-filestyle.min.js");
$('#expOl').append("<li><div class='totalaligndiv'><div class='col-md-10 padding-zero bannerimagefilenew bmargindiv1'><input type='file' class='filestyle' data-size='lg' name='expcerti' id='expcerti"+i+"' ></div><div class='col-md-2 padding-zero bmargindiv1'><button type='button' class='btn btn-success btn-sm ' id='Expadd'>+</button><button type='button' class='btn btn-danger btn-sm' id='minus' style='display:none'>-</button></div><div class='clearfix'></div></div></li>");
// $('.filestyle').attr("id","expcerti"+i);
$(this).css('display', 'none');
$(this).siblings("button.btn-danger").css('display', 'block');
i++;
});
$(document).on('click','.btn-danger', function () {
console.log('delete');
$(this).closest("li").remove();
});
});
You have to add the click event listener to the newly created buttons.
i have the following html/php code (php tag ommited)
$user = array(
'name' => Null,
'address' => Null
);
<div id="user">
<a href="#" id="cust_name" data-type="text"
data-pk="'.$user['ag_id'].'" title="Enter customer name">'.$user['name'].'</a>
<a href="#" id="cust_addr" data-type="text"
data-pk="'.$user['ag_id'].'" title="Enter customer address">'.$user['address'].'</a>
<div class="modal-footer">
<button type="button" class="btn btn-default" id="ResetButton">Reset</button>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" id="SaveButton"
data-dismiss="modal">Save changes</button>
</div>
</div>
could you please complete my resetbutton script, the purpose is to assign null to cust_name and cust_addr after the click.. here's the script
<script>
$.fn.editable.defaults.mode = 'inline';
$(function(){
$('#user a').editable({
url: 'post.php'
});
});
$("#SaveButton").click(function() {
$.ajax({
url: 'db.php',
type: 'POST',
data: {}
});
});
$('#ResetButton').click(function() {
// $('#cust_name').editable('setValue', null); // did not worked
// didn't worked even i added class="myeditable" in my <a> tag
/*
$('.myeditable').editable('setValue', null)
.editable('option', 'pk', null)
.removeClass('editable-unsaved');
*/
});
</script>
This seemed to work.
http://jsfiddle.net/U33kT/
I'm not sure the difference, except that I chose all editables (JS line 6):
$('#user a').editable('setValue', null);
But, I tried with single items:
$('#cust_name').editable('setValue', null);
and it seemed to work as well.
Hope this helps.