Here is the Migration file, I have stored two numbers as json in mysql database, ["1234","4568"].
like this the O/P
I am getting is "[\"1234\", \"5678\"]" but I need to print 1234,5678
public function up()
{
Schema::create('store', function (Blueprint $table) {
$table->increments('id');
$table->json('store_numbers');
});
}
//blade view
#foreach($stores as $store)
<tr>
<td>{{ $store->store_id }}</td>
<td>{{ json_encode($store->store_numbers)}}</td>
</tr>
#endforeach
Try this:
#foreach($stores as $store)
<tr>
<td>{{ $store->store_id }}</td>
#php $store_numbers= json_decode($store->store_numbers); #endphp
#foreach($store_numbers as $store_number)
<td>
{{$store_number}}
</td>
#endforeach
</tr>
#endforeach
Related
So I want to show post in data table but there is 2 layer of data, the data it look like this
[
{
created_at":
"id_post":1,
"name":"trying post",
"comment_all":
[
{
"id_user":3,
}
],
So I want to get comment_all, I use this code in blade
#foreach($compalls as $compall )
<tr>
<td>{{ $compall->coment_all->id_user }}</td>
</tr>
#endforeach
but I got this error
Property [id_user] does not exist on this collection instance. (View: directory/file.blade.php)
hope you can help me
Your coment_all is an array. You have to loop through the array to retrieve each id_user:
#foreach ($compalls as $compall)
<tr>
#foreach ($compall->coment_all as $coment)
<td>{{ $coment->id_user }}</td>
#endforeach
</tr>
#endforeach
You need to loop coment_all because it is an array. like the following:
First foreach $compalls and another foreach inside that to get id_user.
#foreach ($compalls as $compall)
<tr>
#foreach ($compall->coment_all as $coment)
<td>{{ $coment->id_user }}</td>
#endforeach
</tr>
#endforeach
I have created a service named User.service.ts and inside i have written this code:
getContactDetials(){
return this.http.get(this.config.apiUrl + 'assets/data/contact-details.json')
.map(response => response.json());
}
And when i am trying to access the content using this service in contact.component.ts then strangely i am not able to see any results. For further investigation i have logged in the console then the results shows as 'undefined'.
The code for my contact.component.ts is:
contactDetails: any[];
constructor(private _userService: UserService) {
console.log('Contact Tab is pressed!!');
}
ngOnInit() {
this._userService.getContactDetials()
.subscribe(data => this.contactDetails = data.results);
console.log(this.contactDetails);
}
The template where i am binding the data is :
<tbody>
<tr *ngFor="let item of contactDetails">
<td>{{ item.field_email }}</td>
<td>{{ item.field_first_name }}</td>
<td>{{ item.field_last_name }}</td>
<td>{{ item.field_mobile }}</td>
<td>{{ item.field_department }}</td>
<td>{{ item.field_contact_email_address }}</td>
<td>{{ item.field_mobile_1 }}</td>
</tr>
</tbody>
But unfortunately i am not able to display the data in the table. Can anybody help me? What is the mistake i made?
Thanks
If 'data.results' shows undefined, then may if you try to log only 'data' would give you some insights to what you are receiving on the other end.
I have a blade where I'm printing the content of a table.
For some columns I need to add the CSS class according the value I'm printing.
E.g. if it's "OK", add class Green, otherwise class red.
Of course the logic will be more complex, but the point is that all the logic will be related to the style.
Which one is the best recommended place to save this type of function/method?
Do I need to create a Model?
** UPDATE **
<thead>
<tr>
<th> ID </th>
<th> Name </th>
<th> Last Checked </th>
<th> Status </th>
</tr>
</thead>
<tbody>
#foreach ($users as $u)
<tr>
<td> {{ $u->id }}</td>
<td> {{ $u->name }}</td>
<td> {{ $u->last_login }}</td>
<td> {!! statusWrapper( $u->status ) !!}</td>
</tr>
#endforeach
</tbody>
</table>
"statusWrapper" is the function that I'd like to call to decorate the Status value.
So the status is a number, and the output will be something like <span class="..."> .... </span>
If status should include HTML like showing different colors I recommend you use #include
// resources/views/statusWrapper
#if($status == 'good')
<span style="color: green;">thats really good</span>
#else
<span style="color: red;">not good</span>
#endif
and then in your table view
#foreach ($users as $u)
<tr>
<td> {{ $u->id }}</td>
<td> {{ $u->name }}</td>
<td> {{ $u->last_login }}</td>
<td>
#include('statusWrapper', ['status' => $u->status])
</td>
</tr>
#endforeach
You could also look at extending blade: https://laravel.com/docs/5.5/blade#extending-blade
But I will not recommend you to put HTML in your PHP code as it's easier to keep your HTML in your view files for future edits.
I recommend you what I always do myself. You don't need to make a model, you just have to make a helper file and write all your custom functions in it. For example you can make a file named helper.php in app/Http/Helpers/ path. Then you have to make your project aware of this file. To do that you just have to add it in your composer.json file in autoload -> files object like this:
"autoload": {
"files":[
"app/Http/Helpers/helper.php"
]
}
After this just run command composer dump-autoload. Now you can access to your custom functions which are in you helper.php file from anywhere.
app/providers/AppServiceProvider.php (You can create a different Service Provider, if you wish)
use Illuminate\Support\Facades\Blade;
...
class AppServiceProvider extends ServiceProvider
{
...
/**
* Bootstrap any application services.
*
* #return void
*/
public function boot()
{
Blade::directive('statusWrapper', function ($status) {
return "<?php echo App\ViewComponents\StatusWrapperComponent::statusWrapper( $status ); ?>";
});
}
}
app/ViewComponents/StatusWrapperComponent.php
namespace App\ViewComponents;
class StatusWrapperComponent {
public static function statusWrapper ($status) {
if($status == 'good')
echo '<span style="color: green;">thats really good</span>';
else
echo '<span style="color: red;">not good</span>';
}
}
resources/views/yourview.blade.php
<thead>
<tr>
<th> ID </th>
<th> Name </th>
<th> Last Checked </th>
<th> Status </th>
</tr>
</thead>
<tbody>
#foreach ($users as $u)
<tr>
<td> {{ $u->id }}</td>
<td> {{ $u->name }}</td>
<td> {{ $u->last_login }}</td>
<td> #statusWrapper($u->status) </td>
</tr>
#endforeach
</tbody>
</table>
If you're planning to use the function in multiple blade templates, then Tohid's answer is the best.
If you just need the function in a single template, you can define it directly in the .blade.php file like this:
#php
if ( !function_exists( 'mytemplatefunction' ) ) {
function mytemplatefunction( $param ) {
return $param . " World";
}
}
#endphp
Then in you can call the function from within the same template:
<p>{{ mytemplatefunction("Hello") }}</p>
The conditional function definition is needed if you include the blade template multiple times in the same session.
I want to display my Json data that return from PHP file as like this:
"{\"success\":true,\"message\":\"Transaction history found.\",\"user_transactions\":[{\"user_id\":\"4\",\"amount_charged\":\"4.00\",\"amount_transferred\":\"14400.00\",\"app_rate\":\"3600.00\",\"charged_currency\":\"USD\",\"beneficiary_phone\":\"256775542757\",\"beneficiary_first_name\":\"Sapkota\",\"beneficiary_last_name\":\"Suresh\",\"beneficiary_country\":\"UG\",\"transferred_currency\":\"UGX\",\"transaction_status\":\"Delivered\",\"order_id\":\"259\",\"created_date\":\"2017-07-25 13:35:48\",\"last_modified_date\":\"2017-07-25 13:35:48\"},{\"user_id\":\"4\",\"amount_charged\":\"5.00\",\"amount_transferred\":\"18000.00\",\"app_rate\":\"3600.00\",\"charged_currency\":\"USD\",\"beneficiary_phone\":\"256775542757\",\"beneficiary_first_name\":\"Sapkota\",\"beneficiary_last_name\":\"Suresh\",\"beneficiary_country\":\"UG\",\"transferred_currency\":\"UGX\",\"transaction_status\":\"Delivered\",\"order_id\":\"258\",\"created_date\":\"2017-07-25 06:23:05\",\"last_modified_date\":\"2017-07-25 06:23:05\"}]}"
Which is fetch using Get as like:
$http.get("clients.php").then(function (response) {
$scope.response = response;
$scope.results = JSON.parse(response.data);
console.log($scope.results);
}
The problem is that, don't get any result in console .log & nothing in table row which I have write in this way. So, anybody please help me.
<table>
<tr ng-repeat="result in results.user_transactions">
<td>{{ result.beneficiary_first_name}}</td>
<td>{{ result.transaction_status }}</td>
</tr>
</table>
You need to parse the response as it is string.
$http.get("clients.php").then(function (response) {
$scope.response = response;
$scope.results = JSON.parse(response.data);//Parsing string to JSON
console.log($scope.results);
}
<table>
<tr ng-repeat="result in results.user_transaactions">
<td>{{ res.beneficiary_first_name}}</td>//No need of using index of array
<td>{{ res.transaction_status }}</td>
</tr>
</table>
First you have to parse your string result to JSON using JSON.parse().
$scope.results = JSON.parse(response.data);
Also there is another issue in your html
<table>
<tr ng-repeat="result in results.user_transactions">
<td>{{ result.beneficiary_first_name}}</td>
<td>{{ result.transaction_status }}</td>
</tr>
</table>
Working Demo
I'm working on coupons project, and i want to display to the client all the coupons that available to purchase.
When i click on the button that call to the function "getAllCoupons()" it works and it returns the results in JSON, but when i want to Insert the results into the table with ng-repeat it displays only if the function returns more than one coupon, if there is only one coupon the ng-repeat don't displays nothing.
This is my controller
angular.module('companyApp', []);
angular.module('companyApp').controller('companyController',
function($rootScope, $scope, $http) {
$scope.getAllCoupons = function() {
$http.get("rest/CompanyService/getAllCoupon").success(
function(response) {
$scope.allCoupons = response.coupon;
});
This is my HTML
<div ng-app="companyApp" ng-controller="companyController">
<button class="tablinks" ng-click="getAllCoupons()" id="getAll">Get all coupons</button>
<table align="center" class="table table-striped" style="width: 900px;">
<thead>
<tr>
<th> Id </th>
<th>Coupon Title</th>
<th>Amount</th>
<th>Start Date</th>
<th>End Date</th>
<th>Price</th>
<th>Message</th>
<th>Coupon Type</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="x in allCoupons">
<td>{{ x.id }}</td>
<td>{{ x.title }}</td>
<td>{{ x.amount }}</td>
<td>{{ x.startDate }}</td>
<td>{{ x.endDate }}</td>
<td>{{ x.price }}</td>
<td>{{ x.message }}</td>
<td>{{ x.type }}</td>
</tr>
</tbody>
</table>
</div>
But if i write it without the ng-repeat it works and i get it in JSON:
<div ng-app="companyApp" ng-controller="companyController">
<button class="tablinks" ng-click="getAllCoupons()" id="getAll">Get all coupons</button>
{{ allCoupons }}
</div>
The response for single coupon is:
{"coupon":{"amount":"149","endDate":"04/12/2020","id":"6","message":"only big sizes","price":"79.9","startDate":"07/08/2014","title":"pajamas","type":"FASHION"}}
And the response for multiple coupons is:
{"coupon":[{"amount":"60","endDate":"05/09/2020","id":"5","message":"warranty for 1 year","price":"200.99","startDate":"20/02/2014","title":"sunglasses","type":"FASHION"},{"amount":"149","endDate":"04/12/2020","id":"6","message":"only big sizes","price":"79.9","startDate":"07/08/2014","title":"pajamas","type":"FASHION"}]}
Thanks for help :)
You are referencing an object not an array, check the docs for using an object in ngRepeat's arguments.
You would need ng-repeat="(key, value) in allCoupons
Try this
<tr ng-repeat="(key, value) in allCoupons">
<td>{{ value.id }}</td>
<td>{{ value.title }}</td>
<td>{{ value.amount }}</td>
<td>{{ value.startDate }}</td>
<td>{{ value.endDate }}</td>
<td>{{ value.price }}</td>
<td>{{ value.message }}</td>
<td>{{ value.type }}</td>
</tr>
Hope it helps
The server's response for a single coupon is in a different format from what it is for multiple coupons.
You should talk to your server guys and ask them to fix this. The coupon attribute needs to be an array of coupons regardless of whether there is a single coupon or multiple coupons. If there are no coupons, the coupon variable can either be undefined or an empty array.
If the server guys make this change for you, your UI code should work as is.
I understand, sometimes, it can be hard to get the server guys to comply with your request in a timely fashion, especially if they are on a different team.
If this is the case, you can put in a minor patch on the UI code to get the UI working with the existing service, until the server guys come up with a fix. You will have to change your $http.get snippet like below (Also incorporating the .success to .then change suggested by #Claies):
$http.get('rest/CompanyService/getAllCoupon').then(
function(response) {
if(!response.coupon) {
// No Coupons
$scope.allCoupons = [];
} else if(response.coupon instanceof Array) {
// Multiple Coupons
$scope.allCoupons = response.coupon;
} else {
// Single Coupon
$scope.allCoupons = [response.coupon];
}
});
Note: This fix is only a temporary solution. The server code has to be fixed eventually. There is absolutely no justification for the server to send the response in different formats.