I am using asp.net for a website and i am using nested master page.
i want to load dynamic a picture from the nested master page.
the html code in the nested master page is:
<a runat="server">
<asp:Image id="usrimg" src="" alt="Image Not Found" runat="server" />
</a>
the C# code is:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
var u = Session["user"] as Worker;
String s = "/images/" + u.UserName + ".jpg";
usrimg.ImageUrl = s;
}
}
note that the path is correct( i debug the code behind)
but always the source in the inspect is unknown.
this is the result :
<img id="userphoto_ContentPlaceHolder1_usrimg" src="" alt="Image Not Found">
i solve it by using :
usrimg.Attributes["src"] = s;
Related
I want to show all images that are in nuxtjs, i used the strorage (Laravel ) to save the files
<img v-for="(row, index) in files" :src="'storage/' + row" :key="index" alt="" width="150px" height="150px" class="img-fluid">
The link is as follows
http://localhost:3000/storage/example.jpg
but nothing show
I tested this before, Don't you think the problem could be from the controller?
public function index()
{
$files = scandir(storage_path('app/public/'));
$allFile = array_diff($files, ['.', '..', '.gitignore']);
return response()->json($allFile, 200);
}
The problem here is with the image path you need to specify where your image file exactly is, so you did most of its part like :src="'storage/' + row" but since your actual path to your image is something like http://localhost:8000/storage/example.jpg (the base URL of the Laravel app).
If both Laravel and Nuxt.js app serve under the same port and host
You need a leading slash in your src attribute to make an exact path.
<img v-for="(row, index) in files" :src="'/storage/' + row" :key="index" alt="" width="150px" height="150px" class="img-fluid">
If they are not serving on the same host and port
You have to declare an individual variable for your base URL, preferably in .env file and then refer to it and prepend it to your image src attribute.
So let's say we gonna define it in .env file, then it should be something like this:
//.env
BASE_URL=http://localhost:8000/
Then we will refer to it in our javascript data method (if that was not exists we will use default value as 'http://localhost:8000/').
data: function() {
return {
baseURL: process.env.BASE_URL || 'http://localhost:8000/ OR http://site.test/'
}
}
And in the last step we will prepend it to our image src attribute just like this:
<img v-for="(row, index) in files" :src="baseURL + 'storage/' + row" :key="index" alt="" width="150px" height="150px" class="img-fluid">
I am using html tags and I have written some code on code behind but it is not picking the values given to id. Infact it says the 'FileUpload1' does not exist in the current context. I do not want to use asp controls at all. I have heard adding runat = "server" does the thing but still cannot find the id's. What am I doing wrong?
<div id="mainContent">
<div class="column" id="colFull">
<div class="contentSection">
<div id="progress" style="display: none">
<img alt="Loading .." src="../../../Images/ajax.gif" />
</div>
<table width="100%">
<tr>
<td class="label" style="width:15%">
Upload File
</td>
<td class="description" >
<input type="file" id="FileUpload1" runat="server"
class="largeTextField" onclick="Upload" multiple="multiple"
style="width:260px;"/>
<input type="button" id="btnUpload"
runat="server" value="Upload" />
</td>
</tr>
</table>
mycodebehind:
public partial class PgPracFileUploader : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Upload(object sender, EventArgs e)
{
string filename = Path.GetFileName(FileUpload1.PostedFile.FileName);
string contentType = FileUpload1.PostedFile.ContentType;
using (Stream fs = FileUpload1.PostedFile.InputStream)
{
using (BinaryReader br = new BinaryReader(fs))
{
byte[] bytes = br.ReadBytes((Int32)fs.Length);
string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
string query = "insert into tblFiles values (#Name, #ContentType, #Data)";
using (SqlCommand cmd = new SqlCommand(query))
{
cmd.Connection = con;
cmd.Parameters.AddWithValue("#Name", filename);
cmd.Parameters.AddWithValue("#ContentType", contentType);
cmd.Parameters.AddWithValue("#Data", bytes);
con.Open();
cmd.ExecuteNonQuery();
con.Close();
}
}
}
}
Response.Redirect(Request.Url.AbsoluteUri);
}
}
It says FileUpload1 does not exist in the current context.
Try to change:
<input type="file" id="FieUpload1" runat="server" class="largeTextField" onclick="Upload" multiple="multiple" style="width:260px;"/>
to
Id Must be same as you are using in the .cs page
\/\/\/\/
<input type="file" ID="FileUpload1" runat="server" class="largeTextField" onclick="Upload" multiple="multiple" style="width:260px;"/>
As stated here your id attribute is case sensitive so you are using id then the server will just serve it up as it is in your page, but if you used ID then the server will be serve that control as a asp.net control.
I'm trying to embed a booking system widget to my bolt homepage (the one and only homepage, using base-2018 theme). I paste it into the Content window, selecting Source first. Bolt seems to interpret what is going on, as various tags and IDs are highlighted in the code.
The widget code is roughly so:
<div id="bokun [blabla]">Loading...</div>
<p><script type="text/javascript"><br />
var w15;<br />
(function(d, t) {<br />
var host = 'widgets.bokun.io';<br />
var frameUrl = 'https://' + host + '/widgets/15';<br />
var s = d.createElement(t), options = {'host': host, 'frameUrl': frameUrl, 'widgetHash':'w15', 'autoResize':true,'height':'','width':'100%', 'minHeight': 0,'async':true, 'ssl':true, 'affiliateTrackingCode': '', 'transientSession': true, 'cookieLifetime': 43200 };<br />
s.src = 'https://' + host + '/assets/javascripts/widgets/embedder.js';<br />
s.onload = s.onreadystatechange = function() {<br />
var rs = this.readyState; if (rs) if (rs != 'complete') if (rs != 'loaded') return;<br />
try {<br />
w15 = new BokunWidgetEmbedder(); w15.initialize(options); w15.display();<br />
} catch (e) {}<br />
};<br />
var scr = d.getElementsByTagName(t)[0], par = scr.parentNode; par.insertBefore(s, scr);<br />
})(document, 'script');<br />
</script></p>
I have only edited out the unique ID this widget has. Otherwise, this is copied from the provider and works on my current Wordpress site...ALTHOUGH when I paste it into Wordpress, the editor notifies me that "there's something wrong" and offers me to correct it.
How do I insert this? Do I need to create a .js file and reference it in compliance with Twig standards and if so, how do I? I should also note that the widget will redirect to a different page within the same site once you press something within it. Thank you.
Bolt version: 3.6.5
You need to add every tag and attribute that you need into the `config.yml.
If I do the following :-
<asp:Image Id="img1" Height="100px" Width="100px" ImageUrl="/picture.jpg/>
the rendered html will be roughly
<img src="/picture.jpg" style="height:100;width:100"/>
I see a lot of SEO apps etc that recommends that images should be
<img src="/picture.jpg" height="100px" width="100px" />
Is there any way of forcing asp.net of using height and width attributes instead of using style attribute?
You have to do this in the code-behind file unfortunately. For example, by tying into the Page_Init as follows:
void Page_Init(object sender, EventArgs args)
{
img1.Attributes["width"] = "100";
img1.Attributes["height"] = "100";
}
Alternatively...
You could use a <img runat="server" /> tag as follows:
<img src="~/picture.jpg" height="100" width="100" runat="server" />
ASP.Net will treat it as an HtmlImage on the server.
it is simple html:
<%--
<a href="?language=de">
<img src="/Images/Company/de.png" alt="Webseite auf Deutsch" style="border: 0;" />
</a>
--%>
i would like to make from them html.actionlink:
<%= Html.ActionLink("", "ChangeCulture", "Account", new { lang = "de", returnUrl = this.Request.RawUrl }, new { #style = "background-image: url(/Images/Company/de.png)", #class = "languageLink" }) %>
I would like to have my link without text. it doesn't work, null in a first parameter its not allowed. image is to short as normal. how can i use html.actionlink without text but with image??
Here is a solution.
<a href="<%= Url.RouteUrl("MyRoute", new { id = Model.Id }) %>">
<img src="myimage.png" alt="My Image" />.
</a>
Essentially, ActionLink is for text links and there isn't an equivalent for images, but you can use Url.RouteUrl to get the address for the link and put any HTML code you like inside of the anchor (W3C permitting of course).
This way is easiest (using Razor):
<img src="myimage.png" alt="My Image" />
based on a previous SO question (that was closed), here's a solution:
public static string ImageLink(this HtmlHelper htmlHelper,
string imgSrc, string alt,
string actionName, string controllerName, object routeValues,
object htmlAttributes, object imgHtmlAttributes)
{
UrlHelper urlHelper = ((Controller)htmlHelper.ViewContext.Controller).Url;
string imgtag = htmlHelper.Image(imgSrc, alt, imgHtmlAttributes);
string url = urlHelper.Action(actionName, controllerName, routeValues);
TagBuilder imglink = new TagBuilder("a");
imglink.MergeAttribute("href", url);
imglink.InnerHtml = imgtag;
imglink.MergeAttributes(new RouteValueDictionary(htmlAttributes), true);
return imglink.ToString();
}
the orignal can be found here: Is there an ASP.NET MVC HtmlHelper for image links?
Here is my humble contribution, using Razor (as an example) for when a Font Awsome character is used as an image:
<p>
#Html.ActionLink(" ", "Create", "RouteName", new { id = Model.ID }, new { #class = "fas fa-plus text-center" })
</p>
The character in between the two quotes is alt+255 (hit the ALT key, then key-in 255 on the num keyboard, then release the ALT key).
Indeed, neither "" nor " " nor string.Empty work with ActionLink, but alt-255 does. This is a very old trick (from the DOS days) to display a hidden blank character. So far I have not encountered any problems with this trick.