I've upgraded the old ckeditor with the new ckeditor, only I'm struggling with the behaviour of the new one.
It seems that the new one removes my complete table.
For example from this input:
<table>
<tr>
<td>
This is a test
</td>
</tr>
</table>
he will make this:
<p>This is a test</p>
I need the table, so how can I prevent ckeditor to replace my <table> tags with a <p> tag?
config.toolbar = [
{ name: 'insert', items: [ 'Table' ] }
];
please use the above code as in new versions of ck editor you have to mention tables in toolbar.
When adding table item in config as mentioned in jibran's answer. It gave me an error.
Best thing to do it is to open CKEditor builder given here: https://ckeditor.com/cke4/builder
Select table in config and download the editor to use it.
Related
I'm working with the MailChimp Transactional API but am having an issue populating an email template that uses a mc:repeatable section. I can't find any docs or examples on how to do this. Here is the endpoint im using https://mailchimp.com/developer/transactional/api/messages/send-using-message-template/
And here is my email template
<!DOCTYPE html>
<html lang="en">
<head>
<title>Your Order</title>
</head>
<body>
<div>Thanks for your order</div>
<div>Your receipt for your order from</div>
<div mc:edit="store_name">Store Name</div>
<div>Order Type</div>
<div mc:edit="order_type">Type</div>
<div>Products:</div>
<table>
<tr mc:repeatable="products">
<td mc:edit="quantity">Quantity</td>
<td mc:edit="product_name">Product Name</td>
<td mc:edit="price">Price</td>
</tr>
</table>
</body>
</html>
I'm able to populate all of the mc:edit areas using this as the template_content in the request body:
const content = [
{
name: 'store_name',
content: 'Any Store Name'
},
{
name: 'order_type',
content: 'Pickup Order'
},
{
name: 'subtotal',
content: '$80.00'
},
{
name: 'taxes',
content: '$2.22'
},
{
name: 'fees',
content: '$0.00'
},
{
name: 'total',
content: '$82.22'
}
]
I can even populate a SINGLE row in the repeatable section if I add objects for quantity, product_name and price but I need to be able to REPEAT this section and add multiple quantity > product name > price lines.
Any advice or help or docs would be great, thanks!
From the MailChimp template language reference, it doesn't appear that <tr> elements are supported by mc:repeatable. See the third (bolded) point and note that, while <table> is a block level element, <tr> is not.
mc:repeatable
mc:repeatable is used to provide a duplication action for a particular element within a template.
Syntax: mc:repeatable.
Use mc:repeatable on block-level elements (like <div> and <p>) with the exception of lists, or inline elements (like <img>, <a>, and <span>).
mc:repeatable elements can be nested within each other, but use care if you’re going to do this. We don’t encourage this use.
mc:repeatable can be used on the same element as mc:edit, but nesting mc:repeatable beneath mc:edit will render content that is editable but not repeatable.
If you want to apply styles to repeatable container elements or elements within repeatable containers, either use class or apply them in-line. Don’t use the id attribute.
If they do happen to work, you might need to use mc:variant and per-product names for the subfields. Something like this:
<table>
<tr mc:repeatable="products" mc:variant="product1">
<td mc:edit="product1_quantity">Quantity</td>
<td mc:edit="product1_product_name">Product Name</td>
<td mc:edit="product1_price">Price</td>
</tr>
<tr mc:repeatable="products" mc:variant="product2">
<td mc:edit="product2_quantity">Quantity</td>
<td mc:edit="product2_product_name">Product Name</td>
<td mc:edit="product2_price">Price</td>
</tr>
<tr mc:repeatable="products" mc:variant="product3">
<td mc:edit="product3_quantity">Quantity</td>
<td mc:edit="product3_product_name">Product Name</td>
<td mc:edit="product3_price">Price</td>
</tr>
</table>
const content = [
{
name: 'product1_quantity',
content: '5'
}, {
name: 'product1_name',
content: 'Some Product'
}, {
name: 'product1_price',
content: '$49.99'
},
{
name: 'product2_quantity',
content: '1'
}, {
name: 'product2_name',
content: 'Some Other Product'
}, {
name: 'product2_price',
content: '$1,200'
},
{
name: 'product3_quantity',
content: '13'
}, {
name: 'product3_name',
content: 'Some Third Product'
}, {
name: 'product3_price',
content: '$17.50'
}
];
If this looks like it isn't for building a list from dynamic data, that's because I don't think it is. It looks like it's a tool for easily getting styles into the Campaign Builder.
Inside the builder, there is a Product concept that includes the kind of information you appear to want to send in your email. The tutorial for the builder indicates that while a Product section is repeatable, you need to have a source of data connected to the builder and must choose the Products to include at design time.
Use Product content blocks to add items from your connected online store. Each block is designed to contain a product name, custom description, price, and call-to-action button. And if you turn on e-commerce tracking in your email settings, your report will show purchase revenue.
To use a Product block, follow these steps.
Click a Product block or add one to your email. If you’re working with an existing block, skip to step 4.
In the Select a store modal, choose the store you want to add products from. If you haven’t yet connected a store, you’ll be prompted to do so.
Click the product you want to add.
In the Products menu, edit the Title, Button, and Link to URL as needed. You can also click the edit icon to choose a different product, or click the settings icon to check your store connection.
I have allowedcontent=true which is working and allowing me to have attributes in my opening tags; however, CKEdtior is still removing the closing tag attributes. I am using the editor to allow modification of simple Handlebars templates that use {{each}} and {{/each}}. The issue comes when using this with a table and wanting to repeat my rows.
For example, I have the following HTML entered into source:
<table>
<tr data-each={{each Person}}">
<td class="col-student-id">{{Identifier}}</td>
<td class="col-name">{{Name}}</td>
</tr data-each="{{/each}}">
</table>
When I click out of source, it removes the attribute on my closing tr tag.
Is there anyway to force CKEditor to not remove this attribute? If not, does anyone know of a way to allows me to use something like this:
<table>
{{each Person}}
<tr>
<td class="col-student-id">{{Identifier}}</td>
<td class="col-name">{{Name}}</td>
</tr>
{{/each}}
</table>
When I try the above example, it is reformatted to be:
<section>{{each Person}} {{/each}}
<table>
<tr>
<td class="col-student-id">{{Identifier}}</td>
<td class="col-name">{{Name}}</td>
</tr>
</table>
Your input source code is invalid - closing tags cannot have attributes in HTML, so CKEditor ignores them. Read more in CKEditor HTML Autocorrection Issue.
The following is the DOM details:
<div id: "abc_440"
<table class = "listtable" >
<tbody>
<tr>
<td id = "someid" >
<td class = 'someclass_item"> This is Text </td>
<td class = 'someclass_button">
< a > Add </a>
</td>
</tr>
</tbody>
</table>
</div>
I need to click on 'Add' for particular text at "This is Text". I have to use div with ID (abc_440)to locate the corresponding table as there are may divs with this same dom layout. but index at div ID (for example 440) keeps changing to random number. How do I handle it in general ?
Please help.
I think that what you want to do is very similar to the previous Watir question.
Given that the id is randomly generated, it does not sounds like a good way of finding the link. You will likely need to use the text of the same row.
Assuming that the "This is Text" is unique (as you said you want to find the Add link for it), you can find that td, go to the parent row and then get the link.
b.td(:text => 'This is Text').parent.link.click
If you need to ensure that the text is in the second column, then you can do:
b.trs.find{ |tr|
tr.td.exists? and tr.td(:index => 1).text == 'This is Text'
}.link.click
The tr.td.exists? is added in case some of your rows do not have any tds (example a header row), which would cause an exception when checking the second criteria.
Don't mix quotes in HTML tags. id: doesn't work. <td>s should rarely be empty. The Add button should be a button, not an <a>nchor element. Buttons only work in <form>s.
<form id="abc_440" action='someURI'> <!-- The handler for the button. -->
<table class="listtable">
<tbody>
<tr>
<td id = "someid">
<!-- What goes here? -->
</td>
<td class='someclass_item'>
This is Text
</td>
<td class='someclass_button'>
<button name='add'>Add</button>
</td>
</tr>
</tbody>
</table>
</form>
You should be able to find the button through its name attribute, add, and through the form's id attribute, abc_440. Who generates the ids?
Once you have the problem of finding the add button solved, and figuring out where the form's id comes from, please then stop using tables for formatting. There's no need for that. Learn about <form>s, <fieldset>s, <legend>s, and <label>s. I doubt you need the *some_id* part, the text part should probably be a <label>, and you can use CSS to format your <label>s as:
label {
width: 150px;
float: left;
}
fieldset p {
clear: left;
}
I having trouble using a rowtemplate with a detail grid.
Basically when I use them in combination, the rendering is messed up.
See this fiddle, http://jsfiddle.net/yzKqV/, to reproduce this error (uncomment the commented out line and run again to see the error).
How do I fix this?
I think the reason your rowTemplate is not working when you use detailTemplate is because it needs to have the tr and first td defined like a hierarchy grid. (http://jsfiddle.net/yzKqV/3/)
<script id="rowTemplate" type="text/x-kendo-tmpl">
<tr class="k-master-row">
<td class="k-hierarchy-cell"></td>
<td> #= FirstName # </td>
<td> #= LastName # </td>
</tr>
</script>
I'm trying to setup new text into a text field using Watir. The text field is placed inside iframe.
<div id="div_popup_layer" style="width: 100%; height: 100%;">
<div id="id_Login" class="ui-draggable" style="position:absolute;left:372.5px;top:279px;width:501px;height:274px;z-index:15">
<table id="popup_cont_id_Login" cellspacing="0" cellpadding="0" topmargine="0">
<tbody>
<tr>
<td align="left" valign="middle">
<iframe id="frame_id_Login" height="274px" frameborder="0" width="501px" allowtransparency="true" src="/sws.login/gnb/loginView.sws?basedURL=undefined&popupid=id_Login" tagtype="popup_iframe" name="frame_id_Login">
The text field has next Xpath:
//*[#id="IDUserId"]
Or CSS Path:
html body#POPUP_BODY table#loginBackground tbody tr td form#loginForm table tbody tr td table tbody tr td table tbody tr td div#userIDBlock table tbody tr td table tbody tr td#swsText_body_IDUserId_td.sws_text_normal_body div input#IDUserId.sws_text_input
And in case of HTML it looks like this:
<div><input type="text" value="" maxlength="63" style="width:142px; " class="sws_text_input" name="IDUserId" id="IDUserId" onfocus=" swsText_styleChangedFocus('IDUserId');" autocomplete="off" tagtype="text"></div>
I've checked a lot of variants without success. For example:
browser.frame(:id => "frame_id_Login").text_field(:name => "IDUserId").set "admin"
Returns:
/var/lib/gems/1.8/gems/watir-webdriver-0.5.3/lib/watir-webdriver/elements/frame.rb:9:in `locate': unable to locate frame/iframe using {:id=>"frame_id_Login"} (Watir::Exception::UnknownFrameException)
Could anyone help me with it? I need to put any text into the field.
#browser.text_field(:id => "IDUserId").set "TEXT"
#browser.text_field(:name => "IDUserId").set "TEXT"
#browser.text_field(:class => "sws_text_input").set "TEXT"
Those will all work for a this text field as long as it is not contained in a frame, at which point you will need to identify it.
You only want to use Xpath as a last result, as it is fragile and complicated. I'm not even sure if CSS works as I've never tried it.
Please check out Željko's WATIR book or www.watir.com for basic locator methods.
Maybe watir has been updated since these answers were posted, but none of these frame methods worked for me. I was able to successfully use the iframe method, and interact with that just like any other object. Once the iframe object was selected, I could call on DOM elements after the iframe call successfully. Was only able to select the iframe object using its 'id' tag even though it had a 'name' attribute as well..
browser.text_field(:id => "handle").exists?
#=> false
browser.iframe(:id => "secureform").text_field(:id => "handle").exists?
#=> true
The working solution is:
browser.frame(:index => 1).text_field(:index => 0).set "admin"
Now I'm trying to understand why :)
Another working solution
browser.frame(:id => "iFrameID").text_field(:id => /TextField/).set "data"
HTH