I have an external API that returns array data and I want to display it in my blade view
have tried like this but I'm getting an error
<div class="row">
<div class="col-md-12">
<table class="">
#foreach($deviceStatus as $dt)
<tr>
<th>DEVICE NUMBER</th>
<td>{{$dt['mDeviceID']}}</td>
</tr>
#endforeach
</table>
</div>
</div>
error
Undefined index: mDeviceID
Array Data
array:12 [▼
7200408497 => array:4 [▼
"payload" => array:2 [▼
0 => array:44 [▼
"id" => 4484
"position" => array:2 [▶]
"mDeviceID" => "7200408497"
"slave" => array:2 [▶]
"payload" => ""
"deviceDetails" => array:9 [▶]
"isActivated" => true
"serial" => "7200408497"
"isDeleted" => false
"status" => 0
]
1 => array:44 [▶]
]
"count" => 2
"total" => 0
]
7200408223 => array:4 [▶]
How can I access that data in array data?
<div class="row">
<div class="col-md-12">
<table class="">
#foreach($deviceStatus as $dt)
#foreach($dt['payload'] as $dts)
<tr>
<th>DEVICE NUMBER</th>
<td>{{$dts['mDeviceID']}}</td>
</tr>
#endforeach
#endforeach
</table>
Related
I am send and fetch data from MySql Database with Express.js and Sequelize.js. All my code works correctly. My problem is, posted data not rendering on the Handlebars template until refresh the page. I also tried res.render method after SaveSettings method but don't worked. I want to render updated data after redirect.
Solved
You're missing return before settings.update(). Without it, the SaveSettings promise resolves before the update has completed - #Phil
function SaveSettings(Model, values) {
return Model.findByPk(1).then((settings) => {
if (!settings) {
return Model.create(values).catch((e) => console.log(e));
} else {
return settings.update(values).catch((e) => console.log(e));
}
});
}
Routes
router.get("/admin", csrf, isAuth, controller.getGeneral);
router.post("/admin", isAuth, controller.postGeneral);
Controllers
exports.getGeneral = (req, res) => {
Models.General.findByPk(1).then((result) => {
return res.render("dashboard/index", {
title: "General Settings",
data: result,
});
});
};
exports.postGeneral = (req, res) => {
SaveSettings(Models.General, req.body)
.then(() => res.redirect("/admin"));
};
SaveSettings Method
function SaveSettings(Model, values) {
return Model.findByPk(1).then((settings) => {
if (!settings) {
return Model.create(values).catch((e) => console.log(e));
} else {
settings.update(values).catch((e) => console.log(e));
}
});
}
Frontend
<form action="" method="post" class="table-responsive">
<input type="hidden" name="_csrf" value="{{csrfToken}}" />
<div class="d-flex justify-content-end">
<button type="submit" class="btn btn-success">Save</button>
</div>
<table class="table table-striped table-sm mt-3">
<thead>
<tr>
<th scope="col">Slot</th>
<th scope="col">Value</th>
</tr>
</thead>
<tbody>
<tr>
<td class="align-middle">Name</td>
<td class="align-middle">
<input
name="name"
class="form-control"
type="text"
value="{{data.name}}"
/>
</td>
</tr>
<tr>
<td class="align-middle">Description</td>
<td class="align-middle">
<input
name="description"
class="form-control"
type="text"
value="{{data.description}}"
/>
</td>
</tr>
<tr>
<td class="align-middle">Email</td>
<td class="align-middle">
<input
name="email_address"
class="form-control"
type="email"
value="{{data.email_address}}"
/>
</td>
</tr>
</tbody>
</table>
</form>
I am able to do axios.delete to remove an item from my database. But won’t be updated immediately unless I refresh the page or go to another page. here is the full component
function GestImages() {
//load Data from db
load data is working fine :
const [images, setImages]=useState([])
useEffect(()=>{
Axios.get("http://localhost:4000/produit/images")
.then(res=>{
setImages(res.data)
})
.catch(err=>{
console.log(err.message)
})
},[])
// delete Data from db
const deleteImage=(id,e)=>{
Axios.delete(`http://localhost:4000/produit/images/${id}`)
.then((res)=>{
setImages(prevImages => prevImages.filter(image => image.id !== id))
})
.catch(err=>{
console.log(err.message)
})
}
return (
<div className="container">
<div className="row row-a">
<div className="col-lg-12 col-md-12 d-flex justify-content-between" style={{backgroundColor:'#000000'}}>
<h1 className="justify-content-start" style={{color:'#FFFFFF'}}>Ajouter des images</h1>
<Link to='/gest-images/add-images' style={{marginTop:"1%"}} ><button className="btn btn-primary justify-content-end">Ajouter</button></Link>
</div>
<div className="col-lg-12 col-md-12 ">
<table className="table table-hover">
<thead>
<tr>
<th scope="col">Produit Name</th>
<th scope="col">Image</th>
<th scope="col">Action</th>
</tr>
</thead>
<tbody>
{
images.map(images=>(
<tr key={images.id}>
<th>{images.produits.produitName}</th>
<td style={{width:"30%"}}><img src={"../../images/"+images.pathImage} style={{width:"20%"}} alt="produit img"/></td>
<td><button className="btn btn-danger" onClick={(e)=>deleteImage(images.id)}>Supprimer <FontAwesomeIcon icon={faTrashAlt} style={{color:"#FFFFFF"}}/> </button> </td>
</tr>
))
}
</tbody>
</table>
</div>
</div>
</div>
)
}
export default GestImages
I am trying to deal between Symfony 5 & Tempus Dominus Bootstrap4 Datetimepicker. My Datetime input form only work with an update function, when an event exist. I want to pass an attribute to my form but it seems to doesn't work.
I have this builder :
$builder->add('date', DateTimeType::class, [
'required' => true,
'widget' => 'single_text',
'attr' => [
'html5' => false,
'placeholder' => 'Date',
'class' => 'form-control datetimepicker-input',
'data-target' => '#datetimepicker1'
],
]);
My template :
<div class="row row-datetime">
<div class="input-group date col" id="datetimepicker1" data-target-input="nearest">
{{ form_widget(form.date, {'html5':false } ) }}
<div class="input-group-append" data-target="#datetimepicker1" data-toggle="datetimepicker">
<div class="input-group-text datetimepicker-button">
<i class="fa fa-clock"></i>
</div>
</div>
</div>
</div>
{% block javascripts %}
{{parent()}}
<script>
$('#datetimepicker1').datepicker({
format: 'dd.MM.yyyy',
});
</script>
{% endblock %}
But the result is unexpected, Chrome returns my input type as "datetime-local".
In another template for editing an existing event, I have this code, Without form_widget :
<div class="row row-datetime">
<div class="input-group date col" id="datetimepicker1" data-target-input="nearest">
<input type="text" class="form-control datetimepicker-input" data-target="#datetimepicker1"/>
<div class="input-group-append" data-target="#datetimepicker1" data-toggle="datetimepicker">
<div class="input-group-text datetimepicker-button">
<i class="fa fa-clock"></i>
</div>
</div>
</div>
</div>
And it works like a charm I don't understand... If I try this code in my first template, Twig create two datetime inputs. One with the datetimepicker and another classic datetime.
I really don't understand.
Can somebody help me with this please ?
Thanks.
Best,
Py
Change your builder to this:
$builder->add('date', DateTimeType::class, [
'required' => true,
'widget' => 'single_text',
'attr' => [
'placeholder' => 'Date',
'class' => 'datetimepicker-input',
'data-target' => '#datetimepicker1'
],
'html5' => false,
]);
Note that the html5 specification does not go in the attr array. Also note that you don't have to add the form-control class since symfony will do this on its own where needed.
I am using laravel-excel 3.0 in my laravel project and i am unable to create drop-down list while downloading the list.
Below is Export class code
class MasterFields implements FromView
{
public function view(): View
{
return view('master-fields', [
'master_fields' => [
[
'name' => 'Povilas',
'surname' => 'Korop',
'email' => 'povilas#laraveldaily.com',
'twitter' => ['#povilaskorop', 'test', 'test']
],
[
'name' => 'Taylor',
'surname' => 'Otwell',
'email' => 'taylor#laravel.com',
'twitter' => ['#povilaskorop', 'test', 'test']
]
]
// MasterDataField::get_master_data_set()
]);
}
}
Below is blade code
<table>
<thead>
<tr>
<th style="color:blue;"><b> ID </b></th>
<th style="color:blue;"><b> Field Name </b></th>
<th style="color:blue;"><b> Data Type </b></th>
</tr>
</thead>
<tbody>
#foreach($master_fields as $field)
<tr>
<td>{{ $field['name'] }}</td>
<td>{{ $field['surname'] }}</td>
<td>
<select>
#foreach($field['twitter'] as $twitter)
<option> {{ $twitter }} </option>
#endforeach
</select>
</td>
</tr>
#endforeach
</tbody>
I am using below method to download
return Excel::download(new MasterFields, 'test.xlsx');
As you mentioned the old way of definition doesn't work. But here is an example of the new way: https://laraveldaily.com/laravel-excel-3-0-export-custom-array-excel/
Good Day! I am a newbie in asp.net MVC 5 and is working on a form where one cell is editable then it will be saved in the database, along with the values of the other cells. I've managed to make the cell editable using contenteditable="true" . This is my View:
<div class="container">
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
#Html.ValidationSummary(true)
<div class="col-lg-12">
<div class="col-lg-6"></div>
<div class="col-lg-6">
<div class="form-horizontal">
<div class="form-group">
#Html.LabelFor(m => m.CUSTOMER_ID, "Customer Name", new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.DropDownList("CUSTOMER_ID", ViewBag.CustomerName as IEnumerable<SelectListItem>, "--Select Customer--", new { #class = "form-control" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.ORDER_DUE_DATE, "Due Date", htmlAttributes: new { #class = "col-lg-5" })
<div class="col-lg-7">
#Html.TextBoxFor(model => model.ORDER_DUE_DATE, "{0:yyyy-MM-dd}", new { #class = "form-control", #type = "date" })
#Html.ValidationMessageFor(model => model.ORDER_DUE_DATE, "", new { #class = "text-danger" })
</div>
</div>
</div><!--form-horizontal-->
</div>
</div><!--col lg 12-->
<table id="tbl_orderItems" class="table table-striped table-bordered table-hover dt-responsive nowrap" cellspacing="0">
<thead>
<tr>
<th>Item Code</th>
<th>Quantity</th>
<th>Unit</th>
<th>Item Description</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
#if (TempData["listOrder"] != null)
{
foreach (var items in TempData["listOrder"] as List<ebms.ViewModels.OrderItems>)
{ #Html.HiddenFor(modelItem => items.Id)
<tr>
<td>#items.PRODUCT_CODE</td>
<td contenteditable="true">#items.iQuantity</td>
<td>#items.MEASUREMENT_NAME</td>
<td>#items.ITEM_DESCRIPTION</td>
<td>#items.tmpStatus</td>
<td>
#Html.ActionLink("Remove", "Remove", new { id = items.Id },
new { onclick = "return confirm('Are sure want to remove?');" })
</td>
</tr>
}
}
</table>
<div id="menu1">
<ul>
<li>
<center><a>Select an Item</a></center>
<ul>
<li><a href='#Url.Action("Products", "Sales")'>Products </a></li>
</ul>
</li>
</ul>
</div>
<div class="form-group">
<div class="col-lg-3 pull-right">
<input type="submit" value="Create" class="btn btn-primary" />
</div>
</div>
}
</div>
I've put the contenteditable="true" in the quantity because it is the cell that should be editable. Most of the other values in there are from this form:
It will then be passed on to this form and the quantity should be editable.
Then the Customer will be chosen and the Order Due Date will be put in there as well. My problem is, the value that is typed to the editable cell is not saved in to the database. Can someone help me on how to use contenteditable="true" properly and then save it to the database? Thank you in advanced!