TinyMCE deleting text doesnt update - javascript

I have added the Classic TinyMCE editor to my website (angularjs version) and have the problem that when typing something into the editor, deleting it, and typing in something else doesn't update correctly.
When I write in "Test Support answer", delete it and then type "Maybe it'll work?"
and submit the ticket response, the outcome will be "Test Supp".
This only happens when the whole message is deleted. Deleting part of the message don't seem to cause any problems.
Did anyone else have any similar problem and may know a way of fixing it?

Fixed it myself. Implemented it different on another site and there it seems to work fine. Im not sure what's causing the problem but here's how I fixed it.
Old Implementation:
<form method="post" ng-controller="TinyMceController">
<textarea ui-tinymce="tinymceOptions" ng-model="ticketContent"></textarea> </br>
<button type="button" ng-controller="ticket-answer" ng-click="addAnswerAction()" style="background:#ff6464;color:#fff !important;">Create</button>
</form>
New Implementation (that fixed it):
<form method="post" >
<div ng-controller="TinyMceController">
<textarea ui-tinymce="tinymceOptions" ng-model="ticketContent"></textarea> </br>
<button type="button" ng-click="addAnswerAction(textContent)">Create</button>
</div>
</form>

Related

Interactive Popup/White Space

I am fairly new to the world of coding and am currently designing something using WAMP to assist the misses with her maths. In short I have a page with some basic maths questions on and I have JavaScript running on it to check whether the answers are correct or not.
What I would like to know is, can I use JavaScript or something similar to add in a link that if clicked will open a popup or something similar that the user can write a few bits down to help working out the sums?
I have seen a <button onclick="window.open('whitespace.html');">Thinking Space</button> but this doesnt allow the user to write anything down, obviously as its just a link to another page.
A very basic sample, just pointing you in a possible direction:
<button onclick="window.getElementById('myDiv').style.display = 'block'">Thinking Space</button>
<div id="myDiv" style="display: none">
<textarea name="content" cols="40" rows="5">Test message</textarea>
<button onclick="window.getElementById('myDiv').style.display = 'none'">Close</button>
</div>
i think you can use window.promt
https://developer.mozilla.org/de/docs/Web/API/Window/prompt
Maybe not the best answer but works for me. I created a link to a blank page that the user can then open. They can work the questions out, minimise it, forget about it and if they were to try to open a fresh one, close it or try to refresh it, they will get a message asking if they are sure they want to continue. Works exactly as Id hoped.
<textarea placeholder="Please be aware no data will be saved here.
If closed or refreshed all data will be lost"</textarea>
<script>
window.addEventListener("beforeunload", function(event) {
event.returnValue = "Reloading will cause any notes to be lost.";
});
</script>

Google Apps Script: submit form + keep window content + make browser make an offer to save name/password

I´m trying to submit a HTML form while keeping content of displayed page on the screen and triggering browser to make an offer to save username and password.
<div id="signInForm" class="init">
<form>
<input id="username" type="text" placeholder="Username">
<br><br>
<input id="password" type="password" placeholder="Password">
<br><br>
<button type="submit">Sign in</button>
</form>
</div>
I´ve found out, that keeping content can be done various ways:
preventDefault(), onsubmit="return false", action="javascript:".
I successfully made work each of them. But each of them prevents browser (Chrome and Edge) from doing an offer of saving username and password. As long as I´ve learnt, an HTML form has a default behavior on submit which is navigating to the submission link. My theory is that the "navigating event" itself is what triggers an offer to save username and password. If I´m right, the only way to reach my goal is probably based on letting submission happen default way, while making browser keep the content somehow.
Bur all I ever get after hitting <button type="submit">Sign in</button> is a blank page.
Is it even possible to overcome this simply in Apps Script? Or am I missing something basic?
I tried to programmatically reload my page, but wasn´t able to do so. I don´t know how to work with reload().
I´ve tried this:
<!DOCTYPE html>
<html>
<body>
<div id="x">I´m ORIGINAL page</div>
<button onclick="document.getElementById('x').innerHTML= 'I´m EDITED page';">edit page</button>
<br>
<button onclick="myFunction()">Reload page</button>
</body>
<script>
function myFunction() {
window.location.reload(true);
}
</script>
</html>
The snippet above works for me in Stackoverflow snippet editor, but it doesn´t work in my published GAS web app.
EDIT Probably close to solution for my problem is answer in this post: Redirecting from doPost() in Google Web App, HTML form with App script where the author suggests this:
<form method="post" action="<?!= ScriptApp.getService().getUrl() ?>">
<input type="submit" value="submit">
</form>
But it does nothing for me when copied and pasted and I don´t know how to implement it any other way. It looks general...
I was having the same issue when trying to avoid the page to reload to a blank page. The solution that worked for me was a piece of code that is on Google Apps Script Documentation (I leave the link here)
I hope this solution can help you to solve the blank reloading issue.
<script>
// Prevent forms from submitting.
function preventFormSubmit() {
var forms = document.querySelectorAll('form');
for (var i = 0; i < forms.length; i++) {
forms[i].addEventListener('submit', function(event) {
event.preventDefault();
});
}
}
window.addEventListener('load', preventFormSubmit);
</script>

Form Submit works with Button, but not with Enter key

I am new here, so maybe you need to give me some hints about how everything works in this community. I was already reading a lot here on Stackoverflow but finally signed up.
I am designing a small website for a museum near me which is a non-profit organization. They have a huge collection of ammunition and the information is currently available on paper.
I want a website where I can enter a number and the appropiate information is shown. Everything works so far in my test site. (since no internet available there, it should run locally on a android tablet later)
The only problem I have is that the form submit works with the button, but not with the enter key or "open" key on the androids numberpad.
I am also quite new to javascript-coding since I come from electronics and c-programming on microprocessors, so I may have made mistake.
i currently have the iframe in the main page, but i originally wanted it to open up in a modal. It did not work properly, so maybe I may try that later again.
Live demo here: museum.smallfilms.ch/drei
The code for the form is the following:
<!-- Jumbotron Header -->
<header class="jumbotron hero-spacer">
<h1>Katalog:</h1>
<p>Mit der Munitionsnummer können hier weitere Informationen zur jeweiligen Patrone angezeigt werden.</p>
<p>
<form onsubmit="searchpage()">
<input type="number" pattern="\d*"/min="1" max="9999" id="num" >
<button type="button" class="btn btn-danger" onclick="searchpage()" id="search">Suchen</button>
</form>
The Javascript code is the following:
function searchpage() {
var num = document.getElementById('num');
var targetFrame = document.getElementById('targetFrame');
if (num.value) {
var page = 'pages/' + (+num.value) + '.html';
targetFrame.setAttribute('src', page);
}
}
If you need more code I can deliver this. Just let me know that you need.
The site is now designed to show something for the numbers 1 and 2.
The whole site uses bootstrap and the sites displayed in the iframe use strapdown.js for easier editing. (We need to digitalize about 900 datasets in the end)
I think it is only a small mistake somewhere but after hours of coding and searching the internet i still did not get the source of the error.
Thanks in advance for any help and hint.
Dabbax
Edit: if it helps, i packed the whole page into a zip... museum.smallfilms.ch/drei/drei.zip
I think that the error comes from the line where you are calling the function searchPage(). I would recommend you to try the line below :
<input type="sumbit" class="btn btn-danger" onclick="searchpage()" id="search" value="Suchen">
In this case, when you press enter, the form will be submitted and call the searchPage function.
On your code for the form, try:
<button type="submit" class="btn btn-danger" onclick="searchpage()" id="search"> Suchen </button>
edit: Shaam's answer can be correct but if you say input then you just trying to make it a look like button with bootstrap, a more proper approach would be input type="button" but in your case you should say that this is a button that submit the form.
That's why you should use button and not input here.
This could be your html:
<form id="searchForm" action="some_url">
<input type="number" pattern="\d*"/min="1" max="9999" id="num" >
<input type="button" value="Suchen" class="btn btn-danger entr" onclick="searchpage()" id="search">
</form>
Now add an event listener to the class entr and submit the form if the key is Enter. So the event listener in jquery like
$('.entr').keypress(function(event) {
if (event.which == 13) { // this is the enter key code
document.getElementById('searchForm').submit();
}
});

Unable to click on the submit button with xpath and classname using selenium webdriver

This is the html code :
...
<div class="span_3_of_4">
<p class="text_popup"> Dont Have an Account? |
<a class="fancybox" href="#load_box">Signup</a>
</p>
</div>
<div class="span_1_of_4" align="center">
<input class="button" type="submit" value="Submit"/>
</div>
</div>
</form>
</div>
<script src="js/jquery.form.js" type="text/javascript"/>
Its a submit button. I am trying to automate a registration for using selenium webdriver. There are no ids or names as such for this button. Hence i tried with xpath (taken from firebug) .//*[#id='load_form']/div/div[2]/input and classname - button.
Yet the following error was being thrown Element is not currently visible and so may not be interacted withCommand duration or timeout: 428 milliseconds.
Please suggest as to how can i ever overcome this error and be able to click on the "submit" button.
Selenium Version - 2.44
I encounter this issue a lot, and one thing that normally solves the problem is switching frames. With python I think it's something like driver.switch_to_frame('frame') I may be wrong there with the syntax but definitely try that out
Try this one:
driver.findElement(By.xpath("//div[#id='load_box']/form[#id='load_form']//input[#class='button' and #type='submit']"))
Problem was that there are several form elements with "load_form" on the site and the first one is hidden! that's why you need a more specific xpath like the one above.

iOS sessionStorage and form submits

My head is about to explode. I can't get this to work the way i want, and i can't seem to find out what's wrong with it.
I have a form which i need to process with AJAX.
But before i do that, i want to save it in window.sessionStorage.
The functionality has to work cross-device, and i'm having trouble with iOS.
There's alot of questions around stackoverflow and google concerning this, with various fixes. But none of them seem to work for me.
I have this form:
<form role="form" id="searchForm" data-method="search" action="" onsubmit="return doStuff('search')" data-ajax="false">
<div class="form-group">
<input type="search" id="search" name="s" class="form-control" placeholder="Search...">
<span class="help-block"><small>Search by partnumber, suppler or free text</small></span>
</div>
<button type="submit" data-ajax="false" class="btn btn-block btn-warning">Search</button>
</form>
Now, when the form is submitted, it runs through a function at about 200 lines, i've narrowed it down to where the code breaks.
Right here:
sessionStorage.last = search;
return false;
I
've gone from localStorage to sessionStorage in hope that, that might solve the problem, it didn't
I've tried the "right" way to set the variables with this sessionStorage.setItem('last', 'search')
But to no help.
The form is still being submitted regardless of what i do.
If i return false; BEFORE the sessionStorage it works fine, and stops the form.
It works fine on desktops and android, but it fails misserably on iOS devices
Debugging i've tried:
console.log(sessionStorage.last) returns null
console.log(typeof sessionStorage) returns object
console.log(sessionStorage.last = 'foo') returns foo
If you need more code / need me to try anything, please tell me!
According to Apple's docs, it should work:
https://developer.apple.com/library/safari/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/Name-ValueStorage/Name-ValueStorage.html
I've used localStorage without any issues, but not sessionStorage (though the docs say it should be interchangeable). You could try a try-catch block, so that the code doesn't crash, and you can get some clues. Apple mentions it could throw a QUOTA_EXCEEDED_ERR exception.
try {
sessionStorage.setItem("last", search);
} catch (e) {
alert("error: " + e);
}

Categories

Resources