I am trying to display the image from the file path but it's seeing a different thing entirely, I'm vague of what to do. I am using dropzone. The images are stored in this directory laravel/public/gallery/images. so the url is thus: http://localhost:port/gallery/images. The images are saved in the db successfully but displaying them is an issue. This is the code to display:
<TR><TD>
<DIV class="row">
<DIV class="col-md-12">
<DIV id="gallery-images">
<ul>
#foreach($productVerificationValidation->productDocumentUpload as $productDocument)
<li>
<a href="{{url($productDocument->file_path)}}./.{{$productDocument->file_name}}" target="_blank">
<img src="{{url($productDocument->file_path)}}">
</a>
</li>
#endforeach
</ul>
</DIV>
</DIV>
</DIV>
</TD></TR>
This is the controller to display the view:
public function viewUploadedDocuments($id=null){
$productVerificationValidation = ProductVerificationValidation::findOrFail($id);
return view('product.verification-validation.viewDocuments')->with('productVerificationValidation', $productVerificationValidation);
}
To my surprise when i check the console on Chrome, instead of getting the properties of the images it returns wrong properties as displayed on the screenshot:
but the db record has a different property as displayed on the screenshot:
what wrong am I to make right, Please help out.
Thanks guys, I got it working by appending the file name to it thus:
<DIV class="row">
<DIV class="col-md-12">
<DIV id="gallery-images">
<ul>
#foreach($productVerificationValidation->productDocumentUpload as $productDocument)
<li>
<a href="{{url($productDocument->file_path .'/'. $productDocument->file_name)}}" target="_blank">
<img src="{{ url($productDocument->file_path .'/'. $productDocument->file_name) }}" />
</a>
</li>
#endforeach
</ul>
</DIV>
</DIV>
</DIV>
Related
In the following html block I passed the image into the src attribute in multiple different ways, but the images do not display.
<article class="eventlist-event eventlist-event--upcoming eventlist-event--hasimg eventlist-hasimg eventlist-event--multiday"><a class="eventlist-column-thumbnail content-fill" href="">
<img class="eventlist-thumbnail" data-src="https://upload.wikimedia.org/wikipedia/commons/4/46/Lockheed_Martin_F-22A_Raptor_JSOH.jpg" data-image="https://upload.wikimedia.org/wikipedia/commons/4/46/Lockheed_Martin_F-22A_Raptor_JSOH.jpg" src = "https://upload.wikimedia.org/wikipedia/commons/4/46/Lockheed_Martin_F-22A_Raptor_JSOH.jpg">
</a>
<a class="eventlist-column-date" href="">
<div class="eventlist-datetag">
<div class="eventlist-datetag-inner">
<div class="eventlist-datetag-startdate eventlist-datetag-startdate--month">January</div>
<div class="eventlist-datetag-enddate">2017</div>
<div class="eventlist-datetag-status"></div>
</div>
</div></a>
<div class="eventlist-column-info">
<h1 class="eventlist-title"><a class="eventlist-title-link" href="">Deep Reinforcement Learning for Dialogue Generation </a></h1>
<p><font color="gray" font-family="squarespace-ui-font" font-weight="100">This is the abstract of the project ipso facto. </font></p>
</div>
<div class="clear"></div>
</article>
Is there anything I am missing here?
src = "https://upload.wikimedia.org/wikipedia/commons/4/46/Lockheed_Martin_F-22A_Raptor_JSOH.jpg"
Looks like you've got some whitespaces, have you tried src="https:...?
It doesn't appear to be problematic here, but depending on your view engine/src code it might be affected differently.
*edit:
I'm working with Single Page Aplication, and by using "ui-route" I manage to go threw my different HTML pages without loading new pages.
So I dont need to include the main page code in every other page.
I hope my question is more understandable now.
I have this main page:
but when I go to another page I want the logo and the menu apear but not the quote
Here is the main page code:
<body>
<div style="text-align: center">
<img alt="adminPhoto" src="../Img/admin.png" width="300px"
height="300px">
</div>
<ul>
<li><img alt="Main" src="../Ico/main.png"></li>
<li><a href="#/manageCompanies"><img alt="Manage Companies"
src="../Ico/companies.png"></a></li>
<li><a href="#/manageCustomers"><img alt="Manage Customers"
src="../Ico/customers.png"></a></li>
</ul>
<div ui-view></div>
<div>
<blockquote style="margin-left: 30%;">
Welcome Admin!<br /> We welcome you to try out most convenient Admin
experience.<br /> Designed with the most advanced tools.<br /> Update,
Delete or Create your Companies and Customers - with only one click!<br />
<footer>
<cite>Daniel Liverant</cite>
</footer>
</blockquote>
</div>
</body>
What way I should try?
create a header.php or header .html file. In there paste your menu and logo. Then include the page on each other html file.
example below:
Header.php
<!-- File 1 header.php -->
<img src=".."/>
<nav>
<ul>
<li>
</ul>
</nav>
Content file
<?php
include "header.php";
?>
<blockqoute> <!-- or not? -->
Hope this helps!
The include (or require) statement takes all the text/code/markup that exists in the specified file and copies it into the file that uses the include statement.
Including files is very useful when you want to include the same PHP, HTML, or text on multiple pages of a website.
For PHP create two files:
header.php
<body>
<div style="text-align: center">
<img alt="adminPhoto" src="../Img/admin.png" width="300px"
height="300px">
</div>
<ul>
<li><img alt="Main" src="../Ico/main.png"></li>
<li><a href="#/manageCompanies"><img alt="Manage Companies"
src="../Ico/companies.png"></a></li>
<li><a href="#/manageCustomers"><img alt="Manage Customers"
src="../Ico/customers.png"></a></li>
</ul>
<div ui-view></div>
index.php
<?php include 'header.php';?>
<div>
<blockquote style="margin-left: 30%;">
Welcome Admin!<br /> We welcome you to try out most convenient Admin
experience.<br /> Designed with the most advanced tools.<br /> Update,
Delete or Create your Companies and Customers - with only one click!<br />
<footer>
<cite>Daniel Liverant</cite>
</footer>
</blockquote>
</div>
</body>
You can include header.php anywhere in your website.
All I had to do is to insert the quoate code inside the
<div ui-view> -code- </div>
and that's all.
I am working on a bespoke WordPress build and for some reason, I just cannot get some anchor links to work. It's driving me potty and I just don't know what the problem is.
I have discovered, static anchor links are working fine (the back to top button works). However, I am using Advanced Custom Fields to generate ID's for the anchor tags. The IDs are generating correctly, but won't work as anchor tags.
Anyone have any ideas? The bit I am referring to is the service boxes near the bottom of the page. The idea being you click on these and that they will take you to the services page, and down to the relevant section.
The markup I am using is:
<ul class="cf">
<li>
<div>
<a href="/services/#dimensional-surveys">
<div class="filter"></div>
<img width="500" height="600" src="pexels-photo-175771-500x600.jpeg" class="attachment-feature size-feature" alt="" />
<h3>3D Dimensional Surveys</h3>
</a>
</div>
</li>
</ul>
<ul class="service-list cf">
<li id="#dimensional-surveys">
<div class="feature" style="background-image:url(pexels-photo-175771.jpeg);">
</div>
</li>
</ul>
Just remove the # from id and it will work.
<ul>
<li id="example"></li>
</ul>
I have looked at your page
The point where an ancor should jump to should have no #
You do: <li id="#dimensional-surveys">
But do just <li id="dimensional-surveys">
Fix that first and test again.
You don't want the '#' on the anchor: <li id="#example"></li> should be <li id="example"></li>
I am trying to use the orbit feature in foundation 5. The loader seems to work but images don't load. I've inspected it and the link to images seems to be fine and i seem to have all the up to date JavaScript files needed for it to work.
Any ideas?
http://jsfiddle.net/p7PXS/
<div class="row">
<div class="slideshow-wrapper preloader">
<ul data-orbit data-options="animation:fade;
pause_on_hover:false;
animation_speed:1000;
navigation_arrows:true;
bullets:true;">
<li>
<img src="img/bodymetrix.jpg">
</li>
<li>
<img src="img/highgate.jpg">
</li>
</ul>
</div>
</div>
You seem to be missing those files from your working directory.
When you add a web link it works fine.
I'm not sure if this is really the best method, but I've only been working with joomla for two days so am very inexperienced.
Basically I have an html container in my template that holds a carousel extension and a set of images. The container has a blue background in contract to the white of the rest of the website.
I basically want to toggle that container with the extension on different pages. Here's my code:
<div id="top">
<div id="photos">
<jdoc:include type="modules" name="carousel" />
</div>
<div id="social_media">
<a id="success" href="#">Read about our success stories</a>
<a id="partner" href="#">Be a partner</a>
<a id="facebook" href="#">Join us on Facebook</a>
</div>
</div>
What I want to do is make this entire chunk of code into a Custom HTML module that only display on certain pages.
I've attempted to do this but the extension for the carousel doesn't show up, nor the jdoc:include part. I'm guessing this is because Joomlas text editor doesn't interpret jdoc:includes the same way the joomla engine does.
Is there any way around this?
In order to load a module within an article (or a Custom HTML module) you want to use the loadposition command. Here is what it would look like in your case:
<div id="top">
<div id="photos">
{loadposition carousel}
</div>
<div id="social_media">
<a id="success" href="#">Read about our success stories</a>
<a id="partner" href="#">Be a partner</a>
<a id="facebook" href="#">Join us on Facebook</a>
</div>
</div>