I am trying to show products fetched from database by creating a user control ProductBox and inside it setting the parameters to be shown from the Model. But the following block of code shows the unhandled exception : strUrl doesn't exist in the current context.
I am totally new to MVC. Can you help me spot where the parenthesis is missing?
Here is my code from ProductBox user control.
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<TSRApp.UI.Models.ProductBox>" %>
<%# Import Namespace="TSRApp.UI.Helpers" %>
<%# Import Namespace="TSRApp.Contracts.Common.OperationalContracts" %>
<% string strStartTag = "<div class=\"fl book-shaddow\">";
string strEndTag = "</div>";
if (Model.IsFeatured)
{
strStartTag = "<li " + Model.LiID + " >";
strStartTag = strStartTag + "<div class=\"book-shaddow\">";
strEndTag = "</div></li>";
}
if (Model.ProductName.Length > 40)
{
Model.ProductName = Model.ProductName.Substring(0, 37) + " ...";
}
if (string.IsNullOrEmpty(Model.ProductZoomImage))
{
if (!string.IsNullOrEmpty(Model.ProductSmallImage))
{
string strZoomImage = Model.ProductSmallImage.Substring(Model.ProductSmallImage.IndexOf("src=")).Replace("src=\"", "");
strZoomImage = strZoomImage.Substring(0, strZoomImage.IndexOf("\""));
Model.ProductZoomImage = strZoomImage;
}
else
{
Model.ProductZoomImage = Model.ProductSmallImage.Replace("~", "");
}
}
string strURL = string.Empty;
strURL = "/Product/Information/" + Model.ProductCode;
%>
<%= strStartTag %>
<% if(UiHelper.GetDeviceID()!=4)
{
%>
<%
}
%>
<% if (!string.IsNullOrEmpty(Model.ProductSmallImage))
{
%>
<%= Model.ProductSmallImage%>
<%
}
%>
<img src="<%=Model.ProductSmallImage %>" alt="<%= Model.ProductName %>"
style="height: 200px; width: 170px" />
<%= strEndTag %>
Kindly help me fix this issue.
Thanks.
C# is case-sensitive. Change <%=strUrl %> to <%=strURL %> and you should be good to go.
Related
I have two modals on one page. When clicked on button Add Providers one modal should pop up for that. When I clicked on Add Hospital another modal should pop up. However, no matter which button I clicked on only the modal for 'Providers' showed up? No idea why.
Modal 1 is happening from the render partial provider_access_modal and the second is supposeed to happen at rendering the partial sites_access_modal
<%= render :partial => 'provider_access_modal' %> ##Modal 1
<%= render :partial => 'shared/side_menu' %>
<div id="profiles" class="container-main">
<%= render :partial => 'patients/top_bar' %>
<div class="top-space"></div>
<div class="flash">
<%- flash.each do |name, msg| -%>
<%= content_tag :div, msg, :class => "flash_#{name}" if msg.is_a?(String) %>
<%- end -%>
</div>
<div class="content-container your-sites">
<div class="header">
<div class="icon-circle"><div class="icon"><%= image_tag "my-providers-2x.png" %></div></div>
<div class="title">Your Providers</div>
<div class="button-wrapper">
<%= button_tag "Add Provider", class:"add-button", id: 'add-provider-modal' %>
<div class="push"></div>
</div><!--button-wrapper-->
</div><!--header-->
<div class="body">
<div class="no-records">
<%= image_tag "icon-no-records", class: "image" %>
<div class="text">You have no providers.</div>
</div>
</div>
</div>
<%= render :partial => 'sites_access_modal' %> ##Modal 2
<div class="content-container your-sites">
<div class="header">
<div class="icon-circle"><div class="icon"><%= image_tag "hospitalizations-icon-2x.png" %></div></div>
<div class="title">Your Hospitals</div>
<div class="button-wrapper">
<%= button_tag "Add Hospital", class:"add-button", id: 'add-site-modal' %>
<div class="push"></div>
</div><!--button-wrapper-->
</div><!--header-->
<div class="body">
<% if #active_memberships.count > 0 %>
<table>
<thead>
<tr>
<th>Hospital Name</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<% #active_memberships.each do |membership| %>
<tr>
<td><%= membership.site.name %></td>
<td>
<%= link_to patient_remove_membership_path(id: current_user.id, membership_id: membership.id), method: :put, :data => {:confirm => 'Are you sure you want to leave this site?'}, class: "btn" do %>Leave Hospital<% end %>
</td>
</tr>
<% end %>
</tbody>
</table>
<% else %>
<div class="no-records">
<%= image_tag "icon-no-records", class: "image" %>
<div class="text">You have no sites.</div>
</div>
<% end %>
</div>
</div>
</div>
Here is my provider-select.js code
function providerSearch(input) {
if (input.val()) {
var params = {
"provider_search": {
"query": input.val()
}
}
$.post("/providers/search", params, function(data, status) {
$(".auto-complete-modal-list .content").html(data)
if (data.length == 0) {
var notFound = $('<div>', {
'text': 'No provider found, please invite a provider below',
'class': 'item'
});
$(".auto-complete-modal-list .content").empty().append(notFound)
}
}, "html");
} else {
$(".auto-complete-modal-list .content").empty()
}
}
function providerSelection(event) {
let targetProvider = null;
if ($(event.target).is('button')) {
targetProvider = $(event.target);
}
if (targetProvider != null) {
let providerEmail = targetProvider.closest('.item').data("email")
let providerName = targetProvider.closest('.item').data("name")
$('#provider-selection .item').removeAttr('style').find('button').text("Select");
targetProvider.text("Selected")
targetProvider.closest('.item').css({
"background-color": "rgb(86, 116, 204, .8)"
})
$("#invite-label").fadeOut(function() {
$(this).text(`You are inviting ${providerName} to sign this document`).fadeIn(100);
});
$('#invite_email').val(providerEmail)
}
}
$(document).on('turbolinks:load', function() {
$("#provider-select .input-search").on("keyup", function(e) {
providerSearch($(this));
});
$("#provider-selection").on("click", function(e) {
providerSelection(e);
});
$('#invite_email').blur(function() {
let cantFindText = "Can't find your provider? Invite them via email below"
if (!$.trim(this.value).length) {
if ($('label').text() != cantFindText) {
$("#invite-label").fadeOut(function() {
$(this).text(cantFindText).fadeIn(40);
});
}
}
});
// for add provider access
$('#add-provider-modal').click(function(){
$('#modal').show()
})
});
And then here is my site-select.js code
function siteSearch(input) {
if (input.val()) {
var params = {
"sites_search": {
"query": input.val()
}
}
$.post("/sites/search", params, function(data, status) {
$(".auto-complete-modal-list .content").html(data)
if (data.length == 0) {
var notFound = $('<div>', {
'text': 'No sites found',
'class': 'item'
});
$(".auto-complete-modal-list .content").empty().append(notFound)
}
}, "html");
} else {
$(".auto-complete-modal-list .content").empty()
}
}
function siteSelection(event) {
let targetSite = null;
if ($(event.target).is('button')) {
targetSite = $(event.target);
}
if (targetSite != null) {
let siteId = targetSite.closest('.item').data("id")
$('#site-selection .item').removeAttr('style').find('button').text("Add");
targetSite.text("Added")
targetSite.closest('.item').css({
"background-color": "rgb(86, 116, 204, .8)"
})
}
}
$(document).on('turbolinks:load', function() {
$("#site-select .input-search").on("keyup", function(e) {
siteSearch($(this));
});
$("#site-selection").on("click", function(e) {
siteSelection(e);
});
$('#add-site-modal').click(function(){
$('#modal').show()
})
});
In both of your JavaScript snippets I can see the line
$('#modal').show();
There is:
$('#add-provider-modal').click(function(){
$('#modal').show()
})
and
$('#add-site-modal').click(function(){
$('#modal').show()
})
So when you click your Add Provider Modal or Add Site Model buttons, the same model, with the id "modal", will show.
In the code you have supplied I can't find an element with the ID of "modal" so it must lie within your partials that you have not provided. I would recommend changing the partials to give them different IDs for the different modals and then updating your click handlers to open the correct one at the correct time.
im trying to add the latitude and longitude form javascript to a hidden form value so when i submit it it reverse goeocdes your address , but am not sure how to achieve this. can someone pls help ?
<p>Click the button to get your coordinates. Copy paste them in the fields to get your address</p>
</address></p>
<button onclick="logLocation()">Try It</button>
<script>
var successCallback = function(data) {
document.getElementById('de').innerHTML=('latitude: ' + data.coords.latitude + ' longitude: ' + data.coords.longitude);
var lat = data.coords.latitude;
var long = data.coords.longitude;
var lat= document.getElementById("demo").value
var long = document.getElementById("lat").value
};
var failureCallback = function() {
console.log('location failure :(');
};
var logLocation = function() {
//determine if the handset has client side geo location capabilities
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(successCallback, failureCallback);
}
else{
alert("Functionality not available");
}
};
</script>
<p id="demo"><p/>
<h4>Enter either address or coordinates</h4>
<%= form_for #place do |f| %>
<small class="text-muted">You can also enter IP. Your IP is <%= request.ip %></small>
<%= hidden_field_tag 'latitude', {:id =>'lat', value = ''}%>
<%= hidden_field_tag 'longitude', {:id =>'demo', value = ''}%>
<%= f.submit 'Add!', class: 'btn btn-primary' %>
<% end %>
<div class="card">
<div class="card-block">
<div id="map"></div>
</div>
</div>
Pretty sure all you need is to set the value of those fields to your latitude/longitude
var successCallback = function(data) {
document.getElementById('de').innerHTML=('latitude: ' +
data.coords.latitude + ' longitude: ' + data.coords.longitude);
var lat = data.coords.latitude;
var long = data.coords.longitude;
document.getElementById("demo").value = long;
document.getElementById("lat").value = lat;
};
I want checkbox to be clicked when div.tel_show is clicked
<script type="text/javascript">
$("div.tel_show").on("click",function(event) {
var target = $(event.target);
if (target.is('input:checkbox')) return;
var checkbox = $(this).find("input[type='checkbox']");
if( !checkbox.prop("checked") ){
checkbox.prop("checked",true);
} else {
checkbox.prop("checked",false);
}
});
</script>
I think I need to change var checkbox = $(this).find("input[type='checkbox']");
what should I write instead of input[type='checkbox']
<div class="row">
<div id="media-contents" class="col-lg-12">
<% if #media_contents.empty? %>
<h2 id="no-media">Dosya Bulunamadı</h2>
<% else %>
<% #media_contents.each do |media| %>
<div class="col-lg-4 tel_show">
<div class="thumbnail">
<%= image_tag media.file_name.url %>
<div class="caption">
<p>
<%= check_box_tag "media_contents[]", media.id %>
</p>
</div>
</div>
</div>
<% end %>
<% end %>
</div>
</div>
Thanks in advance.
Try this:
$("div").live("click",function(event)
{
var target = $(event.target);
if (target.is('input:checkbox')) return;
var checkbox = $(this).find("input[type='checkbox']");
if( checkbox.attr("checked") == "" ){
checkbox.attr("checked","true");
} else {
checkbox.attr("checked","");
}
});
Give your checkbox a class or an id, then use e.g. $('#checkbox_id') to find it.
Input type selectors should not have '' around the type, e.g. should be "input[type=checkbox]" instead of "input[type='checkbox']".
This is likely a very simple question with a straightforward answer but I'm something of a newbie when it comes to ASP.NET (MVC).
I am returning an address (in pieces) from my model. Some of components are null. Is there a simple or fluent-like way to check for that null value without a lot of extra code to determine whether or not to display the associated surrounding HTML (not just the value)?
Example:
<% foreach (var item in Model)
{ %>
<h3>
<%= Html.ActionLink(item.name, "Details", new { id = item.ID})%></h3>
<div>
<%= Html.Encode(item.address) %><br />
<%= Html.Encode(item.city) %>,
<%= Html.Encode(item.state) %>
<%= Html.Encode(item.zip) %>
</div>
<% } %>
In the above example, if there is a null value for item.address, I want the <br/> tag to be hidden as well so that only the city, state zip string is displayed.
I'm looking for something more elegant than just putting a <% if () { %> conditional out there. Thanks.
You could write an extension method for HtmlHelper that checked to see if it was null or not, and would output nothing if it was, or field + <br /> if it wasn't.
public static string FieldLine(this HtmlHelper helper, object value, bool addBr)
{
if (value == null)
{
return string.Empty;
}
else if (addBr)
{
return helper.Encode(value) + "<br />";
}
else
{
return helper.Encode(value);
}
}
Remember to import the namespace of your extension class into your View aspx. For this example, if my namespace was "MvcApplication1.Extensions", I would use
<%# Import Namespace="MvcApplication1.Extensions" %>
at the top of my View. Then to use it, it would simply be:
<%= Html.FieldLine(item.address, true) %>
<%= Html.FieldLine(item.city, true) %>
etc.
I'm adding another answer based on what womp described above.. I'd make the helper a bit more generic than he did, and still honor the origional Encode as well...
public static string EncodeWithHtml(this HtmlHelper helper, object value, string html)
{
if (value == null)
{
return string.Empty;
}
else
{
return helper.Encode(value) + html;
}
}
This would allow you to do something like:
<%= Html.EncodeWithHtml(item.address, "<br />") %>
or
<%= Html.EncodeWithHtml(item.address, "<img src=\"images\home.gif\"><br />") %>
Assuming item.address is a string...
<%= Html.Encode(item.address) %>
<% if (!string.IsNullOrEmpty(item.address)) { %>
<br />
<% } %>
of course, this is typed out in the little comment box, so be wary of spelling, case, etc, etc.
Why does this code produce these results?
CODE:
<%# Control Language="C#"
Inherits="System.Web.Mvc.ViewUserControl< RoomsAlive.ViewModels.ProductCatalogViewModel >" %>
<div id="product_nav">
<ul>
<%--ADD PREV TAB--%>
<% if (Model.HasPreviousPage) %>
<% { %>
<li><%= Html.RouteLink("<<", "CatalogMenu", new { controller = "Catalog", action = "Index", style = (Model.GroupName), position = (Model.PageIndex - 1) })%></li>
<% } %>
<%--LOOP HERE--%>
<% foreach (RoomsAlive.Models.ProductMenuView myFPV in Model.ProductMenu)
{ %>
<li><%= Html.RouteLink(myFPV.Name, "CatalogMenu", new { controller = "Catalog", action = "Index", group = Model.GroupName })%></li>
<% } %>
<%--ADD NEXT TAB--%>
<% if (Model.HasNextPage) %>
<% { %>
<li><%= Html.RouteLink(">>", "CatalogMenu", new { controller = "Catalog", action = "Index", position = (Model.PageIndex + 1) })%></li>
<% } %>
</ul>
</div>
RESULTS:
<div id="product_nav">
<ul>
<li>LifeStyle</li>
<li>Rooms</li>
</ul>
</div>
BTW: If I use the <% %> form instead of the <%= %> form it produces this:
<div id="product_nav">
<ul>
<li></li>
<li></li>
</ul>
</div>
Why are you specifying the controller and action in the object part of the Actionlink?
Wouldn't it be best to do it this way:
<%= Html.RouteLink("<<", "Index", "Catalog", new { style = Model.GroupName, position = (Model.PageIndex - 1) }, null)%>
The second property of ActionLink is always the desired action name, and you are setting it to CatalogMenu, but then you're then creating an object that says "Index". For this reason (as I have no idea what you want 'CatalogMenu' to be), I have taken it out.
Please also note the null after the routeValues object. This is because the 10 constructors for Html.ActionLink, this one fits the best:
ActionLink(LinkText, ActionName, ControllerName, RouteValues, HtmlAttributes)
Also, if you use <% ... %> instead of <%= ... %>, then it will not output the link. This is because the ActionLink returns a string. All the '=' does in the tag is effectively a Response.Write.
Hope this explains it.