I am creating a dynamic element as such:
strDivAttend += "<div class=\"row\" id=\"otherAttendee__" + i + "\"><div class=\"col-md-12\"><div class=\"col-md-3\"><div class=\"form-group\">";
strDivAttend += "<label class=\"control-label required\" for=\"newAttendees_" + i + "__AttendeeName\">Attendee Name</label>";
strDivAttend += "<input type=\"hidden\" name=\"newAttendees.Index\" value='" + i + "' /><input class=\"form-control text-box single-line\" data-val=\"true\" data-val-required=\"The Attendee Name field is required.\" id=\"newAttendees_" + i + "__AttendeeName\" name=\"newAttendees[" + i + "].AttendeeName\" type=\"text\" value=\"\" />";
strDivAttend += "<span class=\"field-validation-valid text-danger\" data-valmsg-for=\"newAttendees[" + i + "].AttendeeName\" data-valmsg-replace=\"true\"></span>";
strDivAttend += "</div></div>";
strDivAttend += "<div class=\"col-md-3\" style=\"margin-top: 35px;\">";
strDivAttend += "<a id=\"removeOtherAttend__" + i + "\" href=\"javascript:void(0)\" class=\"removeButtonAttend\" style=\"color:#aaa;\"><i class=\"fa fa-times-circle\"></i> remove</a>";
strDivAttend += "</div></div></div>";
$('#dvOtherAttendees').append(strDivAttend);
The problem that I am running into is that even though the dynamically created script has field validation in there, it is not enforced. Any assistance would be helpful.
Client side validation is initialized on initial page load, any elements added dynamically afterwards won't be validated unless you re-parse your document.
$('form').removeData('validator').removeData('unobtrusiveValidation');
$.validator.unobtrusive.parse(document);
Related
I'm upgrading my Ionic 3 app to Ionic 4.
I'm working google maps and markers. I added few buttons in infoWindow and declared an attirbute data-id. Now I want to get these buttons using this attribute data-id
Here's the related code:
let content = '<b>' + locations[i].name + '</b><br/>' + locations[i].street + "<br/>";
content += "<button id='edit-customer-" + i + "' class='edit-customer button button-md button-default-secondary button-default-md' ion-button data-id='" + locations[i].id + "'>Editar</button>";
content += "<button id='order-customer-" + i + "' class='order-customer button button-md button-default-secondary button-default-md' ion-button data-id='" + locations[i].id + "'>Pedido</button>";
content += "<button id='event-customer-" + i + "' class='event-customer button button-md button-default-secondary button-default-md' ion-button data-id='" + locations[i].id + "'>Evento</button>";
infowindow.setContent(content);
google.maps.event.addListenerOnce(infowindow, 'domready', () => {
let infoWindow = infowindow;
document.getElementById('edit-customer-' + i).addEventListener('click', (event) => {
var targetElement = (<HTMLButtonElement>event.target || event.srcElement);
var id = targetElement.getAttribute("data-id"); //getAttribute shows syntax error 'Property "getAttribute" does not exist on type "EventTarget"'
infoWindow.close();
me.editCustomer(id);
});
});
var id = targetElement.getAttribute("data-id");
syntax error 'Property getAttribute does not exist on type EventTarget'
Am I doing something wrong?
Any alternate way to getAttribute?
I'm running a restaurant discovery website, where users see a bunch of markers on a map, they click on a marker and that opens up an infoWindow in which the user can see meta details for the restaurant.
The problem: i'm trying to make restaurant phone number clickable. When I view the output, in HTML, I see a clickable link, but instead of seeing the phone number in that link, I see my variable name instead (screenshot attached). And when I click on the link, I get an error message (screenshot attached).
See attached code - the relevant CoffeeScript file and the HTML view being rendered.
MAIN.COFFEE FILE
infoHTML = (data) ->
img = if data.photo then "<img onerror='this.parentNode.removeChild(this)' src='#{data.photo}' style='margin:5px 5px 0 0;max-height:70px'>" else ''
html = "<table><tr><td style='vertical-align:top'>#{img}</td><td>"
html += data.name + '<br>'
html += data.address + '<br>'
html += "<a href= '+ data.phone + '> + data.phone</a>" + '<br>' if data.phone
html += "<img src='/assets/uber.jpg' style='max-height:13px'> £#{data.cost}" + '<br>' if data.cost
if data.michelin_status && data.michelin_status != 'yes'
html += data.michelin_status + '<br>'
html += data.rating + '% rated' if data.rating
html + '</td></tr></table>'
VIEW BEING RENDERED
WHAT I SEE WHEN I CLICK ON THE PHONE LINK
You have mixed you quotes, so instead of
html += "<a href= '+ data.phone + '> + data.phone</a>" + '<br>' if data.phone
Use
html += "<a href= '"+ data.phone + "'>" + data.phone + "</a><br>" if data.phone
Also, check How to mark-up phone numbers?
Update - with the tel: prefix:
html += "<a href= 'tel:"+ data.phone + "'>" + data.phone + "</a><br>" if data.phone
I get the PDF output using Telerik. I want to justify the text.
c#
"<p style='text-align:center;'>" + result + "</p>" -->work
"<p style='text-align:left; '>" + result + "</p>" -->work
"<p style='text-align:right;'>" + result + "</p>" -->work
"<p style='text-align:justify;'>" + result + "</p>" --> don't work
centered text in pdf file.
<p style='text-align:center;'>" + result + "</p>" -->work
telerik settings:
telerik do not support text-justify. I have to justify the text, how
do I do it?
http://docs.telerik.com/devtools/silverlight/controls/radrichtextbox/import-export/features-html-support
http://www.telerik.com/help/reporting/report-items-html-text-box.html
var cTyp = dt.Columns[i].DataType.ToString();
if (cTyp == "System.Decimal")
{
textboxGroup.Style.TextAlign = Telerik.Reporting.Drawing.HorizontalAlign.Right;
textBoxTable.Style.TextAlign = Telerik.Reporting.Drawing.HorizontalAlign.Right;
}
I am having an issue using a single page approach. When I move to my "filter page" I want to populate a list of applications via ajax i simulated the call here.
function populateList()
{
$('#drpApplication').empty().listview('refresh');
if (typeof cache["FilterCounter"] == "undefined") {
cache["FilterCounter"] = 1;
}
var listItem = "<option value=" + '\'' + '1' + '\'' + ">" + 'Name1' + "</option>";
$('#drpApplication').append(listItem);
var listItem2 = "<option value=" + '\'' + '2' + '\'' + ">" + 'Name2' + "</option>";
$('#drpApplication').append(listItem2);
var listItem3 = "<option value=" + '\'' + '3' + '\'' + ">" + 'Name3' + "</option>";
$('#drpApplication').append(listItem3);
}
Clicking apply puts me to another page, then when I go back to the filter page the application list Appends a new set of data. Eventhough I tell it to empty the dropdown first. Also selecting an application in the dropdown is suppose to add the selection to another listview on the page
$('#drpApplication').change(function () {
$("#drpApplication option:selected").each(function () {
var filterItemId = 'liApplicationName' + cache["FilterCounter"].toString();
$('#lstApplicationList').append('<li value="' + $(this).val() + '" id="' + filterItemId + '"data-icon="delete"><a onclick="removeFilterItem(\'' + filterItemId + '\')">' + $(this).text() + '</a></li>').listview('refresh');
cache["FilterCounter"] = cache["FilterCounter"] + 1;
});
}).change();
What happens on subsequent visits is when you select an application from the dropdown it puts 2 of the same entries in the listview on the second visit and 3 entries every 1 one selection on the 3rd visit to the page and so on.
It seems that the DOM is caching its contents or something and i cannot stop it?
I started a jfiddle for this but my function to populate the list isnt running. I just started using jfiddle so maybe I have the simulation setup incorrectly?
http://jsfiddle.net/D2gbq/27/
It looks like you are emptying the selects, then refreshing the listview, and then appending the new options. You need to refresh the listview after you append the options in order to make them appear.
Try this:
function populateList()
{
$('#lstApplicationList').empty();
$('#drpApplication').empty();
if (typeof cache["FilterCounter"] == "undefined") {
cache["FilterCounter"] = 1;
}
var listItem = "<option value=" + '\'' + '1' + '\'' + ">" + 'Name1' + "</option>";
$('#drpApplication').append(listItem);
var listItem2 = "<option value=" + '\'' + '2' + '\'' + ">" + 'Name2' + "</option>";
$('#drpApplication').append(listItem2);
var listItem3 = "<option value=" + '\'' + '3' + '\'' + ">" + 'Name3' + "</option>";
$('#drpApplication').append(listItem3);
$('#lstApplicationList').listview('refresh');
$('#drpApplication').listview('refresh');
}
Here is my code:
if (amount != -1)
returnJson.Add("<p style=\"color: black;\">" + double.Parse(res_q.Replace(",", ".")) * amount + " " + res_i + "</p>");
else
returnJson.Add("<p style=\"color: black;\">" + res_q + " " + " ") + res_i + "</p>");
And no matter if the execution of the program goes to if or the else, if res_q="1,5", this returns 15 on server, and 1.5 locally.
Why is this happening?
The problem was in the comma.
I want to apply globalization in my program. Using CultureInfo.InvariantCulture was the answer I needed. Or simple replcing the comma with dot.