0

My new MVC3 web application allows users to store some information about themselves, and we want to be able to display this information in a QR code (to other users, or for the user to copy and make it their own.) At this stage, we just want to have the QR Code point back to the user's profile page on our site. The Google API seems like a good fit for this, and after looking around I was able to put some simple data into an IMG to display on the page.

Something like this:

<div class="display-label">QRCode</div>
<div class="display-field">
    @Html.DisplayFor(model => model.QRCode) 
    <img src="http://chart.apis.google.com/chart?cht=qr&chs=100x100&chl=" alt="Your QR Code" />
</div>

So far, all is well & good. However, the dynamic part of the issue is that we are storing the user's profile URL in the "QRCode" field (for just these purposes.) I have been trying, and failing, to introduce the value in model.QRcode (i.e., the URL) into becoming part of the IMG src value.

So, if the value in model.QRCode was (for example): http://mysite.com/profiles/UserId=101 then I would want to build the page so that the IMG was this:

    <img src="http://chart.apis.google.com/chart?cht=qr&chs=100x100&chl=http://mysite.com/profiles/UserId=101" alt="Your QR Code" />

I have tried HTML Encoding, various brackets, and lots of looking around for help, but am not sure how to build this piece of an IMG src dynamically. Anyone have any good ideas?

edward_h
  • 171
  • 1
  • 2
  • 16
  • it a little anclear are you looking for a tool that would grab the url from db and make it as an image so you can use it in your qrcode – COLD TOLD Mar 28 '12 at 01:53
  • That's close. Really I'm just trying to figure out how to dynamically construct the value in the IMG src quotes. The tail end of the URL that goes into the src determines what the QR code (from Google) redirects you too, and for me it is blank at the moment. – edward_h Mar 28 '12 at 04:38

1 Answers1

0

If you are using a server-side language like PHP, you can write

echo "<img src=\"http://chart.apis.google.com/chart?cht=qr&chs=100x100&chl=" . $userURL . "\" />";
Terence Eden
  • 14,034
  • 3
  • 48
  • 89
  • Thanks Terence. I'll do some research and see if there is .NET equivalent to echo. Or a way to manipulate the quotes like you are doing to have it work out. – edward_h Mar 28 '12 at 17:07
  • I think that I've got it working. The code should look something like what I'll post below (for clarity's sake), where the @Html.DisplayFor actually puts the raw data that I need into the URL content, which goes to the Google API and generates the correct QR code. Terrence's answer got me thinking, and then I found this link: http://stackoverflow.com/questions/2418050/should-i-use-url-content-or-resolveurl-in-my-mvc-views which helped too. Thank you Terrence! – edward_h Mar 28 '12 at 19:13
  • – edward_h Mar 28 '12 at 19:17