Image hyperlink using a value stored in database - html

I am trying to allow the user to link their facebook, twitter etc and have an image for the corresponding link appear which will take them to the link stored in the database.
The problem is, instead of giving me something like "www.facebook.com" it is giving me "http://localhost:60619/User/www.facebook.com"
right now I am using to get this.
<a href="#Url.Action(#Model.Facebook)">
<img src="#Url.Content("~/Content/images/Facebook.gif")" alt="Facebook" /></a>
The Url.Action has managed to remove /User/Profile/www.facebook.com and replace is with /user/www.facebook.com but I can't get it to be just "www.facebook.com".
Edit: I have this figured out but thank you for the help! I just needed to add validation so that the user either enters http:// at the beginning or I will have it added on manually before it is stored.

#{
var url = #Model.Facebook.Split('/');
...
}

Related

link to a certain place in a locally hosted website 127.0.0.1:5500

This is an update to link to a place in a locally-hosted website
I tried the solution:
<a href="http://127.0.0.1:5500/#projects"><button
onmouseover="onbutton(this)" onmouseout="offbutton(this)"
type="button">Projects</button></a>
while it does change the link in my browser from 127.0.0.1:5500 to 127.0.0.1:5500/#projects, it does not take me directly to the div tagged with id #project- it just leaves me at my current place on the website. How can I fix this?
First, as observation, this is not a CSS question. Here we go.
When you use an anchor with the ID attribute, you dont need to use the entire URL. just the #id

using href or routerlink with #

I'm fairly new to changing paths / position of page so I would like a little help on this.
Say, when a button is clicked, I want to scroll down to another portion of the page. (where id of that section is 'xyz') however, I'm using an entirely different component to access that section.
If I were to use href, I can easily do : href="/app/appid#xyz"
however, if appid is a variable retrieved from the ts file, how can I insert it into my href?
It's easier to to use [routerlink]="['app', appid]" but how can I insert the "#xyz" into my string?
Or is there a completely separate and easier functionality I can use?
Thank you
Add the frament attribute:
<a [routerLink]="['app', appid] fragment="xyz">Link</a>
https://angular.io/api/router/RouterLink

ASP.NET MVC Img tag not loading image when loading path from database

I am attempting to make a photo gallery asp.net MVC website, and part of that involves the setting of the src to a local folder that contains images.
#model MyProj.Models.PhotoIndexViewModel
<div class="row" id="tableSearch">
#foreach (MyProj.Models.VideoModel photo in Model.PImgList)
{
<div class="col-sm-3 thumbnail">
#Html.DisplayFor(model => photo.Title)
<a href=#Url.Action("View", new { id = photo.Id })>
<img class="img-responsive"src="#Url.Content(photo.ThumbNailPrev)" alt=#photo.Id /></a>
#Html.HiddenFor(m => m.searchTerm)
#Html.Partial("_Tags", photo)
</div>
}
</div>
The ThumbNailPrev is "~/Pics/.jpg", which relates to a folder in the main part of the project. The issue is that the image does not appear. When I check the image using inspector is says it isn't found at /Pics/(photoid)/jpg. I don't understand why it is doing this, as my pics and the image itself are present at that location. I have also made sure to include the folder in my project, but it still doesn't seem to find the image.
UPDATE:
I just tried something and confirmed it is something to do with the way I'm calling the path from the database. As if I hard code the EXACT same string as the one in the database it works. The question now is why does that work?
For want of a letter..
I finally determined the problem, and it was a pretty dumb one. In code I am saving a jpEg image, but calling it via jpg. After changing the .jpg to .jpeg in the view everything works... If you are having a similar problem, check and make certain the file extension is correct.

How to make a wall of pictures clickable that sends away a value

in HTML I have this wall of pictures with different foods.
<ul>
<li><p>Sallad</p><img src="img/sallad.jpg"></li>
<li><p>Pizza</p><img src="img/pizza.jpg"></li>
<li><p>Sushi</p><img src="img/Sushi.jpg"></li>
<li><p>Pasta</p><img src="img/pasta.jpeg"></li>
<li><p>Indian</p><img src="img/indian.jpeg"></li>
<li><p>Fish</p><img src="img/fish.jpeg"></li>
<li><p>Burger</p><img src="img/burger.jpeg"></li>
<li><p>Steak</p><img src="img/steak.jpeg"></li>
<li><p>Vegetarian</p><img src="img/vegetarian.jpeg"></li>
</ul>
My problem is basically that I have a search function, when I click on one of these pictures I want it to redirect me to another page, I know I can basically use <a href for this, but the thing is I want each of these picture to have one value so that my search function can read it and then display the search result from the database. I.E If I click the pasta picture, it will take me to the result page showing all the pasta dishes in the database.
If any of you have any other suggestions or solutions I would really appraciate it. Thanks a lot for reading!
Simply use a link that contains a query string.
<img src="...">
Do it likewise for the other elements. In your server-side code you can then access the GET variable named "search".
<img src="The URL of the image">
Example
<li><p>Sallad</p><img src="img/sallad.jpg"></li>
OR
<li><p>Sallad</p><img src="img/sallad.jpg"></li>
UPDATE
Try This
<li><p>Sallad</p><img src="img/sallad.jpg"></li>

Share on facebook wall

Haw can i share some info on facebook wall?
http://www.facebook.com/sharer.php?u=http://Mysite.com/default.aspx&t=sometext doesnt work.
I want to add custom share button on the my own website
what do you want to share exactly ??
if it's a website ,just copy the link you want to share and paste it inside the status area .
<script>
function fbs_click()
{
u=location.href;
t=document.title;
window.open(‘http://www.facebook.com/sharer.php?u=’+encodeURIComponent(u)+’&t=’+encodeURIComponent(t),’sharer’,'toolbar=0,status=0,width=626,height=436′);
return false;
}</script>
<a href=”http://www.facebook.com/share.php?u=<url>” onclick=”return fbs_click()” target=”_blank”><img src=”ADD_IMAGE_URL_HERE” alt=”Share on Facebook” /></a>
you can place this code inside your web page in the place that you want the share button to appear , and change to the link you want to share.
for more info check this, this and this