I have this :
<div id="comments-form-buttons">
<div class="btn" id="comments-form-send"><div>Enregistrer</div></div>
<div class="btn" id="comments-form-cancel" style="display: none;"><div>Annuler</div></div>
<div style="clear: both;"></div>
And i would to click on send button.
I have try this
submit.Document.GetElementById("jcomments-form-send").InvokeMember("click")
but it doesn't work.
Can you help me ?
Have a nice day.
You can use the CssClass to get the element(div) and access it in the JS! Remember this CssClass should be unique
#Oaybi, here in the JS u are using the samething i Said in last answer.
U are using a Class ('myDivClass') in the JavaScript to get the elemente getElementsByClassName!
webBrowser1.Navigate("javascript: document.getElementsByClassName('myDivClass')[0].click();void(0);"); //assuming it's first and/or only div with that class
<div id="comments-form-buttons">
<div class="btn" id="comments-form-send"><div>Enregistrer</div></div>
<div class="btn" id="comments-form-cancel" style="display: none;"><div>Annuler</div></div>
<div style="clear: both;"></div>
Do that in your code:
CODE:
//should be the uniq this class name in this case!!
Enregistrer
Annuler
JAVA SCRIPT:
webBrowser1.Navigate("javascript: document.getElementsByClassName('_MyDiv_Test1')[0].click();void(0);");
In this case, u get the DIV BY THE CSS CLASS. Just like i said last answer.
try this and tell me if it worked.
<div id="comments-form-buttons">
<div class="BTN" id="comments-form-send"><div>Enregistrer</div></div>
<div class="btn" id="comments-form-cancel" style="display: none;"><div>Annuler</div></div>
<div style="clear: both;"></div>
$(document).ready(function() {
$(".BTN").click(function(e) { // do some thing here });
});
</script>
I have found this
webBrowser1.Navigate("javascript: document.getElementsByClassName('myDivClass')[0].click();void(0);"); //assuming it's first and/or only div with that class
But i don't know javascript, somebody can translate for me please ?
My div :
<div id="comments-form-buttons">
<div class="btn" id="comments-form-send"><div>Enregistrer</div></div>
<div class="btn" id="comments-form-cancel" style="display: none;"><div>Annuler</div></div>
<div style="clear: both;"></div>
Thank you and have a nice day.
Related
my problem in this question is with Persian characters :
in my app , in browser , my messages and texts are display very well but in back of the Scene is not good , look at image:
and back (in browser page source):
there are this characters , and main problem is here :
in view.cshtml:
#foreach (var choice in question.QuestionChoices)
{
<div class="databox radius-bordered bg-lightgray">
<div class="databox-right bg-blueberry">
<div class="databox-piechart">
<div data-toggle="easypiechart" class="easyPieChart" data-barcolor="#fff" data-linecap="butt" data-percent="50" data-animate="500" data-linewidth="3" data-size="47" data-trackcolor="rgba(255,255,255,0.1)" style="width: 47px; height: 47px; line-height: 47px;">
<span class="white font-90">#choice.AnswerChoices.Count</span>
</div>
</div>
</div>
<div class="databox-left">
<span class="databox-number blueberry"><a style="color: inherit">#choice.Text </a></span>
<div class="databox-text darkgray"></div>
</div>
</div>
}
in top code look at : #choice.Text
and result:
<div class="databox radius-bordered bg-lightgray">
<div class="databox-right bg-blueberry">
<div class="databox-piechart">
<div data-toggle="easypiechart" class="easyPieChart" data-barcolor="#fff" data-linecap="butt" data-percent="50" data-animate="500" data-linewidth="3" data-size="47" data-trackcolor="rgba(255,255,255,0.1)" style="width: 47px; height: 47px; line-height: 47px;">
<span class="white font-90">0</span>
</div>
</div>
</div>
<div class="databox-left">
<span class="databox-number blueberry"><a style="color: inherit">گزینه 1 </a></span>
<div class="databox-text darkgray"></div>
</div>
</div>
<div class="databox radius-bordered bg-lightgray">
<div class="databox-right bg-blueberry">
<div class="databox-piechart">
<div data-toggle="easypiechart" class="easyPieChart" data-barcolor="#fff" data-linecap="butt" data-percent="50" data-animate="500" data-linewidth="3" data-size="47" data-trackcolor="rgba(255,255,255,0.1)" style="width: 47px; height: 47px; line-height: 47px;">
<span class="white font-90">1</span>
</div>
</div>
</div>
<div class="databox-left">
<span class="databox-number blueberry"><a style="color: inherit">گزینه2 </a></span>
<div class="databox-text darkgray"></div>
</div>
</div>
now in top html rendered a (گزینه 2) as a code
how i can fix this issue?
my code is in C# and Asp.net Core.
tnx.
services.AddSingleton<HtmlEncoder>(
HtmlEncoder.Create(allowedRanges: new[] { UnicodeRanges.BasicLatin,
UnicodeRanges.Arabic }));
It looks like you are using a component called "easypiechart" which is not displaying the characters correctly. Is that right?
You must talk to the easypiechart programmers and find a way to fix the problem.
The problem does not seem to be with asp.net core.
<div class="col-xs-6 text-right margin-top-x5">
<div class="adduser pointer" data-url="#Url.Action("Register","Account")"><span class="glyphicons glyphicons-user"></span> Add New User</div>
</div>
On FireBug i can see but it not going to that action.
<div class="adduser pointer" data-url="/Account/Register">
If you want a div to be clickable, you have to give it some code to do something when the user clicks it.
$(function() {
$("[data-url]").click(function() {
location.href = $(this).data("url");
});
}
Alternatively, just use an anchor:
<a class="adduser pointer" href="#Url.Action("Register","Account")">
<span class="glyphicons glyphicons-user"></span> Add New User</a>
#Url.Action("Register","Account") is supposed to only print out the URL of the respective action at the specific place.
What you need instead is #Html.Action. Read more about it here
Are you possibly attempting to use an anchor?
<div class="col-xs-6 text-right margin-top-x5">
<a class="adduser pointer" href="#Url.Action("Register","Account")">
<span class="glyphicons glyphicons-user"></span> Add New User</div>
Or you could use a Html.ActionLink
<div class="col-xs-6 text-right margin-top-x5">
<span class="glyphicons glyphicons-user" />
#Html.ActionLink("Add New User", "Register", "Account", null, new { #class = "adduser pointer" })
I have in an aspx page, some constructions like this:
<div class="weather time-morning active">
<div class="icon">
<i class="sun"></i>
</div>
<div class="content">
<h3>Morning</h3>
<div class="degrees">- 1</div>
<div class="data">
<h2>Sunny</h2>
<div>Wind: E 7 mph</div>
<div>Humidity: 91%</div>
</div>
</div>
</div>
I want in code behind to apply various classes to the tag (and/or add more than one tags, in conjunction to various conditions:
switch (response.currently.summary.ToString())
{
case ("Partly Cloudy"):
//do something
//< i class="cloud windy"></i>
break;
case ("Sunny"):
//do something
//<i class="sun"></i>
//<i class="cloud"></i>
//<i class="sprinkles"></i>
break;
}
I have to say that I started from a static HTML page that mimic the behaviour I want.
Any hints please?
L.E.
For being more precise the whole HTML construction is (statically) like this:
<section>
<div class="weather time-morning active">
<div class="icon">
<i class="sun"></i>
</div>
<div class="content">
<h3>Morning</h3>
<div class="degrees">- 1</div>
<div class="data">
<h2>Sunny</h2>
<div>Wind: E 7 mph</div>
<div>Humidity: 91%</div>
</div>
</div>
</div>
<div class="weather time-day">
<div class="icon">
<i class="sun"></i>
<i class="cloud windy"></i>
</div>
<div class="content">
<h3>Day</h3>
<div class="degrees">+ 3</div>
<div class="data">
<h2>Mostly Sunny</h2>
<div>Wind: N 5 mph</div>
<div>Humidity: 45%</div>
</div>
</div>
</div>
<div class="weather time-evening">
<div class="icon">
<i class="sun"></i>
<i class="cloud"></i>
<i class="sprinkles"></i>
<i class="sprinkles"></i>
<i class="sprinkles"></i>
<i class="sprinkles"></i>
</div>
<div class="content">
<h3>Evening</h3>
<div class="degrees">0</div>
<div class="data">
<h2>Rainy</h2>
<div>Wind: W 12 mph</div>
<div>Humidity: 91%</div>
</div>
</div>
</div>
<div class="weather time-night">
<div class="icon">
<i class="moon"></i>
<i class="cloud"></i>
<div class="snowflakes">
<i class="snowflake"></i>
<i class="snowflake"></i>
<i class="snowflake"></i>
<i class="snowflake"></i>
</div>
</div>
<div class="content">
<h3>Night</h3>
<div class="degrees">- 2</div>
<div class="data">
<h2>Cloudy</h2>
<div>Wind: N 2 mph</div>
<div>Humidity: 47%</div>
</div>
</div>
</div>
</section>
and here conditionally I have to change the tags accordingly to the switch values.
Initially, you have to make your div elements enabled for server side control. In terms of code:
<div id="DivId" runat="server"></div>
Then you could make your checks in your server side code and add the class you want like below:
DivId.CssClass="the name of the css class";
The 'nice' way of doing this would be to change the control you are trying to modify to runat="server" in your aspx
<div id="weatherDiv" runat="server">
And then in your code behind, you can now access the div:
weatherDiv.CssClass = "weather time-morning active";
You can also hack a more MVC Razor paradigm to this with Bind <%#, without the need for a control:
.cs Code Behind
protected string GetWeatherClass(bool extraSprinkles)
{
return extraSprinkles
? "extraSprinkesClass"
: "";
}
.ASPX
<div class="weather <%# GetWeatherClass(true) %>">
based on suggestions, finally I have this approach (don't know if the best, but at least it woks)(MorningTime, MorningDay etc. are ID for corespinding tags):
switch (response.currently.icon.ToString())
{
case ("clear-day"):
//do something
MorningTime.Attributes.Add("class", "sun");
MorningType.Attributes.Add("class", "sun");
DayTime.Attributes.Add("class", "sun");
DayType.Attributes.Add("class", "sun");
break;
case ("partly-cloudy-day"):
//do something
MorningTime.Attributes.Add("class", "sun");
MorningType.Attributes.Add("class", "cloud windy");
DayTime.Attributes.Add("class", "sun");
DayType.Attributes.Add("class", "cloud windy");
EveningTime.Attributes.Add("class", "sun");
EveningType.Attributes.Add("class", "cloud windy");
NightTime.Attributes.Add("class", "moon");
NightType.Attributes.Add("class", "cloud windy");
break;
case ("rain"):
and so on.
I have to integrate a design that includes this kind of menu item:
<div class="cell first">
<a href="#">
<div id="m_account" class="img"></div>
<div class="menu_item">my account</div>
</a>
</div>
How can I make an ActionLink to provide this kind of code?
I sometimes use areas so some links must have new {area = "MyAccount"} attribute.
Thanks.
You can do this:
<div class="cell first">
<a href="#url.Action("YourAction")">
<div id="m_account" class="img"></div>
<div class="menu_item">my account</div>
</a>
</div>
There is no link in this HTML that an ActionLink can replace :
<div class="cell first">
<a href="#">
<div id="m_account" class="img"></div>
<div class="menu_item">my account</div>
</a>
</div>
if you wanted to do something like this:
<a href="myAccount/Login" class="img" id="m_account"/></a>
that would be written like:
#Html.ActionLink("ActionName", "ControllerName", new { id = "m_account", #class = "img" })
you just put any attribute name and values in the second part of the ActionLink
Instead of using Html.ActionLink, use Url.Action
<div class="cell first">
<a href="#(Url.Action("ActionName", "ControllerName"))">
<div id="m_account" class="img"></div>
<div class="menu_item">my account</div>
</a>
</div>
Ok,
I have a Jquery DataTable, which has a click event on the first column. The click event, calls a function which in turns calls a C# Webmethod to retrieve data to populate within the dialog.
My problem is that I can't seem to get the modal to resize. I use the followin settings, but it makes no difference.
$('#myModal').modal(resizable:true);
this is called at the end of the Function. The Method contains sensistive information, so i can't post it's contents, but the frame of the calls are as follows:
"fnRowCallback": function (nRow, aoData, iDisplayIndex, iDisplayIndexFull) {
if (aoData[11] == 'Duplicate' || aoData[11] == 'Duplicate approved') {
$('td:eq(0)', nRow).html('<a class="Main" onclick="ViewDuplicateDetails
(\'' + aoData[12] + '\', \'' + aoData[4] + '\',\'' + aoData[0] + '\');">' + aoData[0] + '</a>');
function ViewDuplicateDetail(param1, param2, param3, param4)
{
AJAX call code to retrieve the data
success:
append results to the HTML elements of my dialog (div)
$('#myModal').modal(resizable:true);
}
I dont get the handles to resize, and when the site is display on a screen where the resolution is not high, then the bottom of the modal isn't visible.
EDIT
I've included the actually modal, incase there is anything glaringly obvious.
<div id="myModal" class="modal hide fade" >
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-hidden="true">×</button>
<h4 id="ticket-id">Message: <span id="messageRef"></span><span
id="messageType"></span>
<span id="checkrecord"></span>
<span id="Id"></span>
</h4>
</div>
<div class="modal-body">
<ul class="nav nav-tabs" id="ticket-tabs">
<li>Record</li>
<li>Found</li>
<li>Comments</li>
<li>Audit</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="tab5">
<div id="1"></div>
<div id="2"></div>
<div id="3"></div>
</div>
<div class="tab-pane" id="tab6">
<div id="results"></div>
</div>
<div class="tab-pane" id="tab7">
<textarea id="txtComments"></textarea>
</div>
<div class="tab-pane" id="tab8">
<div id="audit"></div>
</div>
</div>
</div>
<div class="modal-footer">
<span id="txtWarning" style="float:left; color:#ff0000">You must
enter a comment before saving!</span>
<button id="btnComplete" class="btn btn-danger">Complete</button>
<button id="btnApprove" class="btn btn-primary">Approve</button>
<button id="btnSave" class="btn btn-primary">Save</button>
<button id="btnConfirmComplete" class="btn btn-danger">Confirm
Completion</button>
<div id="dowJones" style="text-align:left;">
<img src="Media/images/img2.png" width="94" height="20"
alt=""/><br />
</div>
</div>
</div>
I believe you need:
$('#myModal').modal({resizable:true});
resizable is not a native option of Bootstrap's modals.
If you want to use jQuery-ui resizable widget, you should initialize it using an explicit call :
$(function(){
$('#modal').resizable({ /*resizable options*/ })
});
See resizable examples and api doc.
If you want to have the initial dialog fit into the screen, you should add some code to check whether the dialogue fits when opened ( $('#modal').on('shown', function(){ ... }) ), by checking the dialog's dimensions against the viewport dimensions, and adjust it if the dialog falls outside.
may be this help:
$('#myModal').modal(...).resize(function(){/*code on resizing*/});
UPDATE
try set size for #myModal or it part in css in percent