I am working on asp.net c# . I want to add javascript function in c# by using htmlgeneric control .I have used code ,
HtmlGenericControl scriptTagLinks = new HtmlGenericControl("script");
scriptTagLinks.Attributes["type"] = "text/javascript";
string scrip = "$(function () {$([src='" + url + "']" + ").pinit();});";
// txtDesc.Text = rdr.GetString(4);
// TxtLink.Text = rdr.GetString(6);
scriptTagLinks.Attributes["src"] = scrip;
this.Controls.Add(scriptTagLinks);
But i should get like this ,
<script type="text/javascript">
$(function () {
$("[src='/pinterest/portals/0/Images/about-person3.jpg']").pinit();
$("[src='/pinterest/portals/0/Images/about-us-group.jpg']").pinit();
});
</script>
But i am getting this as
<script src="$(function () {$([src='/pinterest/portals/0/Images/about-us-group.jpg']).pinit();});" type="text/javascript">
How can i add $([src='/pinterest/portals/0/Images/about-us-group.jpg']).pinit();}); between tags .
Related
I want to change background body image for specific pages.
How can I do that..?? Is there any functionality in Orchard CMS, or I have to do it manually... any suggestions..??
Thanks.
#using(Script.Foot()) {
<script type ="text/javascript">
//<![CDATA[
$(document).ready(function () {
var url = window.location.pathname;
var count = url.match(new RegExp("/", 'g'));
var urlsplit = url.split("/");
var page_class = urlsplit[1];
$('body').addClass(page_class);
});
//]]>
</script>
}
I am building an Asp.net MVC app and would like to add a datepicker.
I have this code in my form in the view
#Html.LabelFor(b => b.Date)
#Html.EditorFor(b => b.Date, new {id = "news_date"})
and I would like to add this javascript to it to enable to datapicker:
$(document).ready(function () {
$("#news_date").datepicker({ dateFormat: 'dd/mm/yy' });
});
however when the application is run it shows the above code as text on the page.
How do I get it to recognize it as javascript?
Use script tag
#Html.LabelFor(b => b.Date)
#Html.EditorFor(b => b.Date, new {id = "news_date"})
<script type="text/javascript">
$(document).ready(function () {
$("#news_date").datepicker({ dateFormat: 'dd/mm/yy' });
});
</script>
wrap your code with script tags
<script type="text/javascript">
$(document).ready(function () {
$("#news_date").datepicker({ dateFormat: 'dd/mm/yy' });
});
</script>
I am dynamically adding a jQuery multiselect control onto a page like this:
var captionCell = new HtmlTableCell { InnerHtml = control.Caption };
var inputCell = new HtmlTableCell();
inputCell.Controls.Add(inputControl);
var row = new HtmlTableRow();
row.Cells.Add(captionCell);
row.Cells.Add(inputCell);
tbl.Rows.Add(row);
And building my javascript string like this:
StringBuilder sb = new StringBuilder();
sb.AppendLine("<script type=\"text/javascript\">");
sb.AppendLine("var $callback = $(\"#callback\");");
sb.AppendLine("$(document).ready(function () {");
sb.Append("$(\"#");
sb.Append(multiSelectControl.ClientID);
sb.AppendLine("\").multiselect(");
sb.AppendLine("{");
sb.AppendLine("show: \"fade\",");
sb.AppendLine("hide: \"fade\",");
sb.AppendLine("click: function (event, ui){");
sb.AppendLine("$callback.text(ui.text + ' ' + (ui.checked ? 'checked' : 'unchecked'));");
sb.AppendLine("},");
sb.AppendLine("});");
sb.AppendLine("});");
sb.AppendLine("</script>");
Then adding the script to the page like this:
ScriptManager.RegisterClientScriptBlock(this.Page, Page.GetType(), "CreateControl" + inputControl.ClientID,
sb.ToString(), false);
But im getting the following error when trying to do this:
Microsoft JScript runtime error: Object doesn't support this property or method
Please assist guys.
Thanks in advance.
You need to have jQuery included in the page to use document.ready, You did not add the script tag to include jquery in the page, Add script tag to include jquery.
<script type="text/javascript" src="/jQueryFolder/jquery.js"></script>
var $callback = $("#callback");
$(document).ready(function() {
$("#ClientID").multiselect({
show: "fade",
hide: "fade",
click: function(event, ui) {
$callback.text(ui.text + ' ' + (ui.checked ? 'checked' : 'unchecked'));
}
});
});
I solved this by creating a user control, and when I need to use the script above I just loaded the user control.
Solved everything and works really well.
My attempted methods.
Looking at the JS via browser, the #ViewBag.CC is just blank... (missing)
var c = "#" + "#ViewBag.CC";
var d = $("#" + "#ViewBag.CC").value;
var e = $("#" + "#ViewBag.CC").val();
var c = "#ViewBag.CC";
var d = $("#ViewBag.CC").value;
var e = $("#ViewBag.CC").val();
if you are using razor engine template then do the following
in your view write :
<script> var myJsVariable = '#ViewBag.MyVariable' </script>
UPDATE:
A more appropriate approach is to define a set of configuration on the master layout for example, base url, facebook API Key, Amazon S3 base URL, etc ...```
<head>
<script>
var AppConfig = #Html.Raw(Json.Encode(new {
baseUrl: Url.Content("~"),
fbApi: "get it from db",
awsUrl: "get it from db"
}));
</script>
</head>
And you can use it in your JavaScript code as follow:
<script>
myProduct.fullUrl = AppConfig.awsUrl + myProduct.path;
alert(myProduct.fullUrl);
</script>
try: var cc = #Html.Raw(Json.Encode(ViewBag.CC)
<script type="text/javascript">
$(document).ready(function() {
showWarning('#ViewBag.Message');
});
</script>
You can use ViewBag.PropertyName in javascript like this.
ViewBag is server side code.
Javascript is client side code.
You can't really connect them.
You can do something like this:
var x = $('#' + '#(ViewBag.CC)').val();
But it will get parsed on the server, so you didn't really connect them.
You can achieve the solution, by doing this:
JavaScript:
var myValue = document.getElementById("#(ViewBag.CC)").value;
or if you want to use jQuery, then:
jQuery
var myValue = $('#' + '#(ViewBag.CC)').val();
None of the existing solutions worked for me. Here's another solution I found that did work:
Controller:
TempData["SuccessMessage"] = "your message here";
View:
let msg = '#TempData["SuccessMessage"]';
Try this:
Anywhere in HTML: <input hidden value=#ViewBag.CC id="CC_id" />
In JS: var CC= document.getElementById("CC_id").value.toString();
Can java script add the contents below to a asp table aswell at the same time (with html tags)
<script type="text/javascript">
$(function () {
$('button').click(function () {
var x = $('textarea').val();
$('textarea').val('');
$('#test1').append('<div id="test">' + x + '</div>');
return false;
});
});
</script>
<textarea style="border: 0" cols="77" rows="2">Write Something....</textarea>
<button>Post Message</button>
<div id="test1"></div>
</asp:Content>
something like:
<script type="text/javascript">
$(function () {
$('button').click(function () {
var x = $('textarea').val();
$('textarea').val('');
$('#test1').append('<div id="test">' + x + '</div>');
//$save append aswell to Table1
return false;
});
});
</script>
<script type="text/javascript">
$(function () {
$('button').click(function () {
var x = $('textarea').val();
$('textarea').val('');
var newdiv = $("<div></div>").html(x).attr('id','test');
$('#test1').append(newdiv);
$('#Table1').append(newdiv);
//$save append aswell to Table1
return false;
});
});
</script>
It seems like you are using jquery here.
Have you got your jquery framework loaded & tried your code to see if it works??
It is running fine on jsfiddle.net here
Updates
If your Table1 is on the same page.
All you need to do is to get hold of the DOM element.
if you have a table
<table id="Table1">
<tr><td>1</td></tr>
<tr><td>2</td></tr>
<tr><td>3</td></tr>
</table>
You can add after your code
$('#test1').append('<div id="test">' + x + '</div>');
this code
$('#Table1 tr:last').after('<tr><td>'+ x +'<td></tr>');
Hope you find this helpful