I actually created a new inputtype to use TinyMCE, but I saw problem, to make thing simple, I tested with existing "textarea" input type, and found I cannot make it work neither.
so I could have html like below
<div class='editable'>
<p>this is a <b>test</b></p>
</div>
when I make it editable as textarea and then click to edit, I expect to see code like below in the textarea
<p>this is a <b>test</b></p>
instead I see string with all tag stripped, I was told to use loadurl to get the content from backend when it is editted, I did that, which works fine.
But now I have another problem, if I click to edit and then click cancel, the stripped text shows, not the string with tags, any idea what is that? what happens to jeditable reset? where it stores the original text when user click edit and then restore it after user click cancel?
Related
I’m trying to make a scraper project that takes links and displays on a html page but you can’t use html tags in pyscript tag.
Is there any way to do it
What I find with printing the link is that it gives the literal string of the link and not a clickable link
This isn’t the actual code but acts as an an example of the problem
<py-script>
Var= ‘Link’
</py-script>
<body>
<a href=link>Link</a>
</body>
You have created a clickable anchor tag. Move your mouse over the text and click it.
The problem is that the pyscript.css file is overwriting the attributes of some HTML tags changing how they appear. Remove pyscript.css from your program and notice the difference.
You could add your own CSS and make the Anchor Element appear how you want. To write serious PyScript programs you will need to learn about the browser DOM, CSS, etc.
I'm having problems with removing tags from TimyMCE. (last version)
invalid_elements : 'br' or valid_elements : 'p/br'
This delete/replace the tag on ctrl+enter from html source but not from the DOM in the editor.
How can i prevent the use of invalid elements in the Editor DOM?
Simply said i want to prevent using a tag not only in the generated html source, but also in the Editor too.
What do you want to have happen when someone presses shift+enter if you don't want the <br> to be used? You can capture any keydown event in the editor and then choose what you want to do instead.
This TinyMCE Fiddle captures the keydown event and simply ignores shift+enter. You can certainly do something different if needed.
http://fiddle.tinymce.com/vogaab/1
EDIT: Based on your comment I updated the fiddle:
http://fiddle.tinymce.com/vogaab/2
...in this version I modify the event to make the event.shiftKey attribute false and then let the event finish as normal. I no longer get a <br> but instead get a <p> tag whether I use enter or shift+enter
In the website I want to automate the there is a button I want to click on, if you inspect the element of the button it looks like this:
<input type="submit" value="Login" class="submit">
So I click on this line any then do "Copy xpath" and copy it to my code like this:
val loginButton: WebElement = driver.findElement(By.xpath("""//*[#id="loginForm"]/fieldset/font/font/input """))
loginButton.click()
Its very weird cause in other places it worked perfectly and sometimes I have problems with it, and then I try by cssSelector but here nothing works :/
The path includes two layers of font elements which seems rather fragile to me - any slight changes to the page structure will mean this path fails to match.
I would try a path that considers just the "semantics" of which element you want to target, and not the precise structure of the page. You want the submit button in the login form, so how about a path like
//*[#id="loginForm"]//input[#type="submit"]
which finds any <input type="submit"> anywhere in the form. If there are several submit buttons you can be more specific with #type="submit" and #value="Login"
XPath is prone to break and IMHO overly complicated... I would use a CSS Selector.
driver.findElement(By.cssSelector("input.submit")).click();
This is Java, BTW, but hopefully you can translate it, if needed.
I am trying to add a few "next" and "back" buttons to a form. The Idea is to divide the filling-out process into several steps and with these buttons, the div of the current step gets hidden and the next resp. previous step is displayed.
My Problem is that when I add buttons in the following way...
<button class="proceed_button" id="loan_information">Proceed</button>
<button class="cancel_button" id="loan_information">Cancel</button>
... they submit the form.
Is every button inside a form-tag considered to be a submit-button?
If so, how can I change this behavior?
If not, why are they doing it then?
Ok, the solution is that the button needs a type.
<button type="button" class="proceed_button" id="loan_information">Proceed</button>
<button type="button" class="cancel_button" id="loan_information">Cancel</button>
Like this, it won't submit the form anymore.
According to http://w3schools.com/html5/att_button_type.asp the default type is depending on the browser, so you should always specify the type.
I'm not sure that you want a button, maybe you want it to look like a button. Either way, refer to this post: rails 3: display link as button?
Once you have your button, you'll need to update your javascript to prevent anything from happening when it's clicked (assuming you have jquery). It's still nice to provide a real fallback for those dinosaurs without js, so assuming your proceed button submits for users without js, for those with js you'd do something like:
$('#proceed_button').click(function(e) { e.preventDefault(); // Show and hide your divs here });
Also note that in your posted code you should not have two buttons with the same id, your ids and classes look swapped.
I am designing a checkbox for a for and I absolutely cannot have the checkbox to toggle when the user clicks on its label, as this label contains a link to open a small infobox where the user gets to know what he or she is accepting by selecting the checkbox.
How can I disable checkbox toggle when clicking on its label?
The code looks simply like this (this element is inside a FormPanel items list:)
{
xtype:'checkbox',
id: 'privacyCheck',
fieldLabel: 'I have read, understood and accepted the privacy policy of ABCDE'
}
Instead of using the boxLabel property or field label on the checkbox, create a separate label object next to the checkbox. This should make it easier to manipulate your handler for the label. Otherwise, you will need to dig through the appropriate DOM element for the boxLabel (not pretty) to get at it.
I know, this topic is rather old, but I found it, searching for a solution to the exact same problem. So I'd like to share.
I needed to modify the browsers behaviour to mimick the behaviour of a legacy site, while making said site "accessible". (The for-attribute of the label tag is needed and a label without a for-attribute can not be used.)
I don't know about ExtJS, but since the legacy site uses jQuery in the frontend, I solved the problem this way:
//[...]
$(document).ready(function () {
$('.donotToogleCheckbox').click(function (event) {
event.preventDefault();
// do other stuff like displaying a dialog or something
})
});
//[...]
<label class='donotToogleCheckbox' for='myCheckbox'>DaLabel</label>
<input id='myCheckbox' name='myCheckbox' type="checkbox">
//[...]