I put an image in both folder:
/Views/Home/chart02.jpg and /Content/chart02.jpg
In the view file index.cshtml:
#{
ViewBag.Title = "Home Page";
}
<h2>#ViewBag.Message</h2>
<p>
To learn more about ASP.NET MVC visit http://asp.net/mvc.
<img src="<%= #Url.Content("~/Content/chart02.jpg") %>" />
<img src="<%= Url.Content("~/Content/chart02.jpg") %>" />
<img src="<%= Url.Content("~")%>/Content/chart02.jpg"/>
<%= Url.Content("~/Home/chart02.jpg") %>
</p>
But none of them works.
In the View Page Source:
<p>
To learn more about ASP.NET MVC visit http://asp.net/mvc.
<img src="<%= /Content/chart02.jpg %>" />
<img src="<%= Url.Content("~/Content/chart02.jpg") %>" />
<img src="<%= Url.Content("~")%>/Content/chart02.jpg"/>
<%= Url.Content("~/Home/chart02.jpg") %>
</p>
Do I miss something somewhere?
You have a mix of Razor and WebForms. Your markup should looks like:
<img src="#Url.Content("~/Content/chart02.jpg")" />
Edited now that you're post is cleaned up and your code is showing properly:
In each one of your image tags, you have a slight error. If you're using MVC 3 and Razor, you don't use <%= %> anymore. Just prefix the code with #.
<img src="#Url.Content("~/Content/chart02.jpg")">
or, depending on your version of MVC, you can skip the Url.Content
<img src="~/Content/chart02.jpg">
Related
Hi I am new to ruby and I have a front ui that I am working on which have an issue displaying certain types of items I am specifying from solr index to display in an mvc ruby blacklight ui, see the snippet below:
<!-- ORAL HISTORY -->
<% elsif document.id =~/oh/ %>
<iframe src="/pdfjs/web/viewer.html?file=%2Fdocpdfview%2F<%=#document.id%>" allowfullscreen webkitallowfullscreen style="width: 100%; height: 640px"></iframe>
<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Download</button>
<div class="dropdown-menu">
<a class="dropdown-item" target="_blank" href="/pdfdownload/<%=#document.id%>">PDF</a>
<a class="dropdown-item" target="_blank" href="/txt/<%=#document.id%>">Plain Text</a>
<a class="dropdown-item" target="_blank" href="/dc/<%=#document.id%>">Metadata (Dublin Core)</a>
</div>
<video id="videoarea" controls="controls" poster="" src=""></video>
<% #document["rdf.fedora.hasPart"].each do |item| %>
<ul id="playlist">
<li movieurl="/mp3/<%=item%>"><%=item%></li>
</ul>
<% end %>
<br><br>
<% #document["rdf.fedora.hasPart"].each do |item| %>
<%=item%>
<div class="preview_image" align="left">
<video class="video-js vjs-fluid vjs-default-skin"
controls=""
data-setup='{ "aspectRatio":"640:120"}'
playsinline=""
poster="/pageturnerserver/ajaxp?theurl=http://localhost:8080/fedora/get/<%=#document.id%>/Preview"
preload="none">
<source
src="/mp3/<%=item%>"
type="video/mp4">
</video>
</div>
<% end %>
<!-- AUDIO -->
<% elsif document.id =~/aud/ %>
<div class="preview_image" align="left">
<video class="video-js vjs-fluid vjs-default-skin"
controls=""
data-setup='{ "aspectRatio":"640:120"}'
playsinline=""
poster="/pageturnerserver/ajaxp?theurl=http://localhost:8080/fedora/get/<%=#document.id%>/Preview"
preload="none">
<source src="/mp3/<%=#document.id%>" type="video/mp4">
</video>
</div>
this is not displaying correctly in my ui in case where the " #document["rdf.fedora.hasPart"].each do |item|" item does not have "rdf.fedora.hasPart", is there a way I can build in the ruby code view logic for if rdf.fedora.haspart to handle when ["rdf.fedora.hasPart"] is none and | item| is none?
thanks in advance, any help is appreciated!
You can run any ruby code inside a view in rails. For your problem you can solve like this:
<% if #document["rdf.fedora.hasPart"].present? %>
# Do something if #document["rdf.fedora.hasPart"] has element inside
<% else %>
# Do something if #document["rdf.fedora.hasPart"] has no element inside
<% end %>
I know this question is answered a million times but I have tried every possible suggestion and nothing works. Here is the structure of my project:
I have tried 3 different directories to put my img.jpg, but non of them displays the image
Here is my jsp:
main.jsp
<%# page language="java" contentType="text/html;
charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1">
<title>Home Page</title>
</head>
<body>
<img value="<%=getServletContext().getRealPath("/") %>" src="/webapp/WEB-INF/imags/img.jpg"/>
<br>
<h1>The FoRoom</h1>
<h2>Millions of users communicate everyday</h2>
Log In
<br>
<a href="${pageContext.request.contextPath}/addUser">Sign Up (Add
User)</a>
<br>
<a href="${pageContext.request.contextPath}/logInAsAdmin">Log In as
an Administrator</a>
<br>
</body>
</html>
Here is the 1st comment section:
<!-- 1st comment section -->
<!-- no error with GET!!!
<input type="image" src="C:\Users\MyUser\eclipse-workspace\.metadata\.plugins\org.eclipse.wst.server.core\tmp0\wtpwebapps\SpringMVC\images\img.jpg">
<input type="image" src="C:/Users/MyUser/eclipse-workspace/.metadata/.plugins/org.eclipse.wst.server.core/tmp0/wtpwebapps/SpringMVC/images/img.jpg" >
<input type="image" src="< %=getServletContext().getRealPath("/images/img.jpg") %>" value="< %=getServletContext().getRealPath("/") %>">
<input type="image" src="< %=getServletContext().getRealPath("/images/img.jpg") %>" value="< %=getServletContext().getRealPath("/images/img.jpg") %>">
<input type="image" src="< %=getServletContext().getRealPath("/images/img.jpg") %>" value="< %=getServletContext().getRealPath("/images/img.jpg") %>" name="img.jpg">
<input type="image" value="< %=getServletContext().getRealPath("/imags/img.jpg") %>" name="img.jpg">
<input type="image" value="< %=getServletContext().getRealPath("/images/img.jpg") %>" name="img.jpg">
<input type="hidden" value="< %=getServletContext().getRealPath("/imags/img.jpg") %>" name="img.jpg">
<input type="hidden" value="< %=getServletContext().getRealPath("img.jpg") %>" name="img.jpg">
<img value="< %=getServletContext().getRealPath("/") %>" src="/webapp/images/img.jpg"/>
<img value="<%=getServletContext().getRealPath("/imags/img.jpg") %>" name="img.jpg">
<img alt="/src/main/webapp/images/img.jpg" src="/src/main/webapp/images/img.jpg">
<br>
<img alt="/main/webapp/images/img.jpg" src="/main/webapp/images/img.jpg">
<br>
<img alt="/webapp/images/img.jpg" src="/webapp/images/img.jpg">
<br>
<img alt="/webapp/images/img.gif" src="/webapp/images/img.gif">
<img value="< %=getServletContext().getRealPath("/") %>" src="/webapp/images/img.jpg"/>
<tools:img path="/images/img.jpg"/>
<img alt="d" src="< %=request.getContextPath() %>/webapp/images/img.jpg">
<img src="C:/Users/MyUser/eclipse-workspace/.metadata/.plugins/org.eclipse.wst.server.core/tmp0/wtpwebapps/SpringMVC/images/img.jpg" >
<img src="C:\Users\MyUser\eclipse-workspace\.metadata\.plugins\org.eclipse.wst.server.core\tmp0\wtpwebapps\SpringMVC\images\img.jpg">
<img src="C:\Users\MyUser\eclipse-workspace\.metadata\.plugins\org.eclipse.wst.server.core\tmp0\wtpwebapps\SpringMVC\images\img.jpg" width="48" height="48">
<c:url value="/imags/img.jpg" var="img" /> (head) , <img src = "/imags/img.jpg" > (body)
<br>
-->
Here is the second comment section:
<!-- 2nd comment section -->
<!-- PROBLEM WITH GET
<img src="<c:url value='./webapp/images/img.jpg' />">
<img alt="<c:url value='/webapp/images/img.jpg' />" src="<c:url value='/webapp/images/img.jpg' />">
<br>
<img src="<c:url value='./images/img.jpg' />">
<img alt="<c:url value='/images/img.jpg' />" src="<c:url value='/images/img.jpg' />">
<img src="<c:url value='images/img.jpg' />">
<img src="<c:url value='/images/img.jpg' />" alt="p">
<br>
<img alt="webapp/images/img.jpg" src="webapp/images/img.jpg"></img>
<img alt="<c:url value='/webapp/images/img.jpg' />" src="<c:url value='webapp/images/img.jpg' />">
<img alt="a" src="< %=request.getContextPath() %>/images/img.jpg">
<img alt="b" src='< %=request.getContextPath() + "/images/img.jpg" %> '>
<img alt="c" src="${pageContext.request.contextPath}/images/img.jpg" />
<img src="${pageContext.servletContext}/images/img.jpg"/>
<img src="${pageContext.servletContext}/webapp/images/img.jpg"/>
<input type="image" src="images/img.jpg" value="< %=getServletContext().getRealPath("/images/img.jpg") %>" name="img.jpg">
<input type="image" src="images/img.jpg" value="< %=getServletContext().getRealPath("/") %>">
-->
In the comments sections is everything I have tried but failed. In the 1st comment section the image is not displayed but no error is shown. When I run my project with a command of the 2nd comment section I get a warning message. For example if I try this:
<img src="<c:url value='./webapp/images/img.jpg' />">
I get this:
[http-nio-8080-exec-4] WARN org.springframework.web.servlet.PageNotFound - No mapping for GET /SpringMVC_Hibernate_Setup/%3Cc:url%20value='./webapp/images/img.jpg'%20/%3E
I have mostly tried to display the img.jpg from the webapp/images. I know that image folder in the WEB-INF is a big NO NO, but at this point I don't know what else to do.
Any help would be very appreciated!!!
EDIT!!!
this is the tutorial I followed: https://www.javaspringclub.com/spring-mvc-hibernate-mysql-example/
I made some changes, but the core is the same.
in my application. js is a function named
function helloWorld() {}
what should I do to call this function on an index.erb of a model?
I try to write the function in the application.js
$("#changePanel").click(function() {
var data = "foobar";
$("#panel").hide().html(data).fadeIn('fast');
});
then I change my layout erb. at the following content
<% if System::get_property('platform') == 'APPLE' || System::get_property('platform') == 'ANDROID' || System::get_property('platform') == 'WP7' || is_bb6 || System::get_property('webview_framework') =~ /^WEBKIT/ %>
<script src="/public/js/application.js" type="text/javascript"></script>
<script src="/public/jquery/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="/public/jquery/jquery.json-2.3.min.js" type="text/javascript"></script>
and in my view i added
<div data-role="page">
<div data-role="header" data-position="inline">
<h1>Model001s</h1>
<a href="<%= Rho::RhoConfig.start_path %>" class="ui-btn-left" data-icon="home" data-direction="reverse" <%= "data-ajax='false'" if is_bb6 %>>
Home
</a>
<a href="<%= url_for :action => :new %>" class="ui-btn-right" data-icon="plus">
New
</a>
</div>
<div id="panel">test data</div>
<input id="incre" value="Change Panel" type="button"> </div>
</div>
I don´t know whats wrong. Please help me
I don't see any #changePanel for your click event to trigger.
I think maybe you should change:
<input id="incre" value="Change Panel" type="button"> </div>
to
<input id="changePanel" value="Change Panel" type="button"> </div>
I am trying to figure out why my AJAX call to a Web service is working on every browser but the IPad. I have an MVC 3 application which makes a Web Service call using Ajax.Actionlink to a Sharepoint API. The call works great everywhere, but the experience seems to fall short on the IPad. on the IPad, I am getting results similar to if you implemented the Ajax.ActionLink without referencing the jquery and Microsoft js scripts. I have tried enabling the Developer tools on the IPad and no longer get an errors. (The only error i was receiving was i tried using the CDN library Microsoft uses and the IPad didn't like that at all.) Now those errors are gone and the call redirects the page to a Partial view. This should not be happening as every other browser (including Safari for windows) seems to display a loading gif and then load the information within the same page. No redirection. Any ideas?
Site Master:
<%# Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %>
<!DOCTYPE html>
<html>
<head runat="server">
<title><asp:ContentPlaceHolder ID="TitleContent" runat="server" /></title>
<link href="../../Content/Site.css" rel="stylesheet" type="text/css" />
<script src="<%: Url.Content("~/Scripts/jquery-1.4.4.min.js") %>" type="text/javascript"></script>
<script src="../../Scripts/jquery.validate.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script>
<%-- <script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.unobtrusive-ajax.js" type="text/javascript"/>
<script src="•http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.js" type="text/javascript" />
<script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/MicrosoftMvcAjax.js" type="text/javascript"/>
<script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/MicrosoftMvcAjax.debug.js" type="text/javascript"/>--%>
</head>
<body style="background-color:White">
<div class="page">
<div id="header">
<div id="title">
<h1>My MVC Application</h1>
</div>
<div id="menucontainer">
<ul id="menu">
<li><%: Html.ActionLink("Home", "Index", "Home")%></li>
</ul>
</div>
</div>
<div id="main">
<asp:ContentPlaceHolder ID="MainContent" runat="server" />
<div id="footer">
</div>
</div>
</div>
</body>
</html>
Index: ( main page)
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<%:/* This calls the Ajax namespace to invoke an async call to a controller method
* we are using the POST method because the GET cache's the callback results
* Refernce:
* http://stackoverflow.com/questions/7282497/tinymce-in-mvc-3-razor-ajax-actionlinks-fail-after-first-ajax-call */
Ajax.ActionLink("Click to Get CIMS Folder", "CallWebService", new AjaxOptions()
{
UpdateTargetId = "placeHolder",
InsertionMode = InsertionMode.Replace,
LoadingElementId = "indicator",
HttpMethod="POST",
})
%>
<div id="indicator">
<img alt="AJAX Indicator" src="<%= Url.Content("~/images/ajax-loader.gif") %>" />
</div>
<div id="placeHolder">
</div>
PartialView (Makecall.ascx)
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<AsyncCallTest.Models.SharepointModel>" %>
<table border="1">
<tr>
<td><font color="Black">Folder Name</font></td>
<td><font color="Black">Link</font></td>
</tr>
<tr>
<% if (Model != null)
{
for (int fileCounter = 0; fileCounter < Model.FolderList.Count(); fileCounter++ )
{
foreach (var file in Model.FolderList[fileCounter].FolderFiles)
{
%>
<td><font color="Black"> <%: file.FileName%></font></td>
<td><font color="Black"> <a href ='<%: file.FileWebPath%>'><%: file.FileWebPath%></a></font></td>
</tr>
<%
}
}
}
%>
</table>
the CDN's were the issue, so I changed the
<script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.js" type="text/javascript" />
<script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/MicrosoftMvcAjax.js" type="text/javascript"/>
<script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/MicrosoftMvcAjax.debug.js" type="text/javascript"/>
to
<script src="<%: Url.Content("~/Scripts/jquery-1.4.4.min.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/jquery.unobtrusive-ajax.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/jquery.validate.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/MicrosoftAjax.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/MicrosoftMvcAjax") %>" type="text/javascript"></script>
Now it works. Thank you. Just odd that it worked in everything but IPad Safari and Javascript was enabled, so you would think it would have worked.
I am using the latest version of BlogEngine.NET, and I want the share buttons of Facebook, linked in, Google Buzz, etc. to go below the menu, but after adding the Facebook, LinkedIn, and Buzz button code, the content next to it disappears. It seems BlogEngine.NET prevents entering script tags or something so this would be a limiting issue. How can this be fixed?
The code is below, see the BUTTON CODE section.
<code>
<div class="login">
<span runat="server" id="aUser"></span><a runat="server" id="aLogin" />
</div>
<ul>
<li><a1 href="<%=Utils.AbsoluteWebRoot %>" rel="home"><%=Resources.labels.home %></a></li>
<li><a1 href="<%=Utils.AbsoluteWebRoot %>archive.aspx"><%=Resources.labels.archive %></a></li>
<li><a1 href="<%=Utils.AbsoluteWebRoot %>contact.aspx"><%=Resources.labels.contact %></a></li>
<li><img src="<%=Utils.ApplicationRelativeWebRoot %>pics/rssButton.png" alt="Feed" /><%=Resources.labels.subscribe %></li>
<li><%=Resources.labels.filterByApml %></li>
<% if (Utils.IsMobile)
{ %>
<li><blog:MobileThemeSwitch ID="MobileThemeSwitch1" runat="server" /></li>
<%
}
%>
</ul>
</div>
</code>
<!--BUTTON CODE -START-->
<code>
<div id="Div1">
<script src='linkedinurl' type='text/javascript' /> <script data-counter='right' data-url='mysiteurl' type='in/share' />
</div>
</code>
<!--BUTTON CODE -END-->
<code>
<div id="content">
<blog:SearchOnSearch runat="server" MaxResults="3" Headline="You searched for" Text="Here are some results for the search term on this website" />
<asp:ContentPlaceHolder ID="cphBody" runat="server" />
<p id="footer">
Powered by BlogEngine.NET <%=BlogSettings.Instance.Version() %><br />
Theme by Mads Kristensen
</p>
</div>
</code>
You need to encode it:
Like this:
site.master
<div style="float:right; padding-left:10px" class="TwitterButton">
<div>
<a href="http://twitter.com/share" class="twitter-share-button" data-url=
<%=Server.UrlEncode(Post.AbsoluteLink.ToString()) %> data-text="
<%=Server.UrlEncode(Post.Title) %>"> Tweet</a>
<script src="http://platform.twitter.com/widgets.js" type="text/javascript">
</script>
</div>
</div>
The output would look like this:
<div style="float:right; padding-left:10px" class="TwitterButton">
<div>
<a href="http://twitter.com/share" class="twitter-share-button"
data-url="http://www.kbdavis07.bloggersonline.com/post/Using-HitSniffercom-
with-BlogEngineNet.aspx" data-text="Using HitSniffer.com with BlogEngine.Net"
data-count="horizontal">Tweet</a>
<script src="http://platform.twitter.com/widgets.js" type="text/javascript">
</script>
</div>
</div>
This code above is for Twitter, and I don't have a working example of LinkedIn code.
But it should be about the same.