I'm able to see the layout of tinymce but i am not able to enter text. Please, help me
solve this issue.
Currently, you can see what I'm trying say here. To check the TinyMCE editor, click in the "Recent Members" text, that's green colored.
i have linked the script file too..
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/tinymce-sk/js/tinymce/tinymce.min.js"></script>
<script type="text/javascript">
tinymce.init({
selector: ".flirt-message",
plugins: "smileys",
toolbar: "smileys"
});
<div id="dialog" title="Basic dialog">
<form method="post">
<textarea name="message" autofocus="" class="flirt-message"></textarea>
<input type="submit" >
</form>
</div>
Related
I had a weird problem with TinyMCE v6. If I use as follows:
<div class="main-wrapper">
<textarea id="wysiwyg">The text to edit.</textarea>
</div>
<script>
tinymce.init({selector:'#wysiwyg'});
</script>
I can see the editor window, but the content is not shown and can't write into it.
Changed it to:
<div class="mymain-wrapper">
<textarea id="wysiwyg">The text to edit.</textarea>
</div>
<script>
tinymce.init({selector:'#wysiwyg'});
</script>
It works like a charm.
I am using materializecss for the first time in my web application and
I am struggling with datepicker. It is not working at all.
I imported materialize.css and js file and use the code
<div>
<input type="date" class="datepicker" />
</div>
and added script code
$(document).ready(function() {
$('select').material_select();
window.picker = $('.datepicker').pickadate({
selectYears: 16, // Creates a dropdown of 15 years to control year
format: 'yyyy-mm-dd'
});
});
but nothing worked, it shows a disabled text box.
Also I want to know how to add timepicker in materializecss?
I had the same problem. My problem was solved with downgrading jquery to 2.1.4. It seems, that on some reason the datetimepicker and jquery 2.2.1 are not working together.
cheers
Thomas
First to know, you need to check the version of your Materialize css and javascript version, also don't forget to check jquery version and use the initialization code in your custom init javascript.
check my code in init.js for initialization, CSS and JS Materialize via cdn
$(document).ready(function() {
$('.modal').modal();
//this are my init
$('#dtp').datepicker();
$('#dtp').setDate(new Date());
});
<html>
<head>
<!-- this is my CSS via cdn -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/css/materialize.min.css">
</head>
<body>
<div class="row">
<form class="col s12 m6 card">
<div class="row center">
<h4>Materialize DateTime Picker</h4>
<div class="input-field col s12 m12">
<input id="dtp" type="text" class="datepicker">
<label for="dtp">Birthday</label>
</div>
</div>
</form>
</div>
<!-- this is my JS via cdn -->
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/js/materialize.min.js"></script>
</body>
</html>
Check the documentation from Materialize website, it is always helpful for programmers like me.
Hope this answer help you
Try to run my Code Snippet
<div class="row">
<div class="input-field col s12">
<input id="idate" type="text" name="idate" class="datepicker" >
<label for="idate">Issue Date</label>
</div>
</div>
$('.datepicker').pickadate({
selectMonths: true,// Creates a dropdown to control month
selectYears: 15 // Creates a dropdown of 15 years to control year,
});
I am building out a form to make it easier for our content people to make tabbed areas, and want the ability to have the output be html, instead of just text. I am using standard post method, but they will be putting image hrefs, and so forth in, and I need them to be able to copy the output and paste it into a page. I know this is simple, but.,..
I'm having trouble imagining the overall structure of what you're doing, but if you are looking for something really basic, you could use Javascript to copy the HTML from some element into a textarea:
<html>
<head>
<title></title>
<script type="text/javascript">
function showMarkup() {
var src = document.getElementById("yourMarkupInHere");
var target = document.getElementById("theMarkup");
target.value = src.innerHTML;
return false;
}
</script>
</head>
<body>
<div id="yourMarkupInHere">
<label for="username">User name:</label>
<input id="username" type="text" />
</div>
<input id="bnShowMarkup" type="button" value="Show markup" onclick="showMarkup()" />
<input id="theMarkup" type="textarea" readonly="readonly" />
</body>
</html>
It could really do with a larger textarea and some attempt at formatting the raw HTML.
FancyBox V2 - I'm stuck when I click the first fancybox link the box loads an incorrect size but when I exist and click the fancy box again it loads right size??
It previously autosized correctly as I have multiple fancybox on website but when I open this fancybox to carry through purchase it autosizes incorrectly on first click then correctly on second click
How do I fix this??
(Obviously I have replaced my real PayPal information with madeup information)
Code is below:
Main Page:-
<!DOCTYPE html>
<head>
<!-- Add jQuery library -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<!-- Add fancyBox main JS and CSS files -->
<script type="text/javascript" src="./source/jquery.fancybox.js"></script>
<link rel="stylesheet" type="text/css" href="./source/jquery.fancybox.css" media="screen" />
<script>
$(document).ready(function() {
$(".fancybox1").fancybox();
}); // ready
</script>
</head>
<body>
Buy
</body>
</html>
Fancybox Page:
<form name="_xclick" action="https://www.paypal.com/cgi-bin/webscr/" method="post" onsubmit="return">
<input type="hidden" name="cmd" value="_xclick">
<input type="hidden" name="business" value="BuyAshirt#gmail.com">
<input type="hidden" name="currency_code" value="GBP">
<input type="hidden" name="item_name" value="Great Shirt">
<input type="hidden" name="amount" value="10.00">
<table>
<td>
<input type="hidden" name="on1" value="Name On Top">Name You Want On Top</td>
<td>
<input id="Top_name" nametype="text" name="os1" maxlength="200"></td>
</td>
<td>
<tr>
</table>
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_xpressCheckout.gif" border="0" name="submit" alt="Make payments with PayPal - it's fast, free and secure!">
<input name= "agree" type="checkbox" id="CHKBOX_1" value="Accept Terms of Service"><span onClick="document._xclick.CHKBOX_1.checked=(! document._xclick.CHKBOX_1.checked);">I accept terms</span> of service
</form>
This method works for me: topRatio: '0'
$(".fancybox").fancybox({
topRatio: '0'
});
It's because fancybox doesn't know the dimensions of the page when opened the first time, width and height are unknown so set to 0. Subsequent times, object dimensions are already cached so fancybox can render the content properly.
From fancybox website:
autoSize : If set to true (default), for 'inline', 'ajax' and 'html' type content width/height is auto determined. If no dimensions set this may give unexpected results
It might be a good idea to set dimensions inside your Fancybox.html page, maybe in the <table> or in the <form> tag like
<table style="width: 620px; height: 320px;"> - or - <form style="width: 620px; height: 320px; display: block;">
eventually you may prefer to set dimensions for this specific form within your script
$(".fancybox1").fancybox({
fitToView: false,
width: 620,
height: 320
});
Your ajax response contains an image and fancyBox does not preload them. So, if you open second time then browser has already cached that image and fancyBox calculates height correctly.
At the bottom of my fancybox iframe page,
I place the following code.
$('#wrapper').height($('#wrapper').height());
I have to do this in some instances because of dynamic content without set a height because of a responsive layout.
this is the dom source of the button I want to click on
<div class="footer clearFloat">
<div class="left">
</div>
<div class="right">
[P]
[-575063738]
[SB_XML]
<input class="button" value="Next step" id="dpTransportResultSelectLink[7]" type="submit">
</div>
</div>"
This is the x-path "/html/body[#id='transport-results']/div[#id='master']/div[#id='master_center']/div[#id='page_content']/div[#id='contentPad']/form[#id='fare_5']/div[2]/div[2]"
How do I frame my locator using "[SB_XML]", irrespective of the form Id?
//*[contains(text(),'[SB_XML]')]/following-sibling::input[1]
I've tested it as an xpath but not in Selenium
lemme know how it goes