MFMailComposeViewController broke CSS styles in html template - iphone

I use MFMailComposeViewController to send a message in html format. If my html template contains the css styles:
<div class="margin:10 10 10 0"> Go To</div>
In this case it works good.
But if I send:
Go To
then I see the letter that comes with broken styles as there (3D is not my misprint)
<div style=3D"margin:10 10 10 10;">Go=C2=A0To</div>
Well as the letter goes broken when I insert in the template symbols from national alphabets.
Somebody can tell what the problem and check with yourself?

I revised my answer to add a second part of the solution:
I found two issues using MFMailComposeViewController to send HTML email with tags.
1) For any HTML body that ends up being encoded as quoted-printable, you must put line breaks such that no lines are > 76 chars.
2) The text within the tag should be wrapped within a to ensure that MFMailComposeViewController does not interpret the content as a link within a link.
For example, the following HTML:
<a href='http://link/to/my/site.com'>site.com</a>
was being turned into:
<a href='http://link/to/my/site.com'><a href='http://site.com'>site.com</a></a>
By changing my HTML body to:
<a href='http://link/to/my/site.com'><span>site.com</span></a>
the email was sent correctly.
A full example:
NSMutableString *body = [NSMutableString string];
// add HTML before the link here with line breaks (\n)
[body appendString:#"<h1>Hello User!</h1>\n"];
[body appendString:#"<span>Click Me!</span>\n"];
[body appendString:#"<div>Thanks much!</div>\n"];
Cheers!

Related

Get ChildElement without using element selector

I am using a protractor to get the text in the second Div within #myDiv. Can someone please advise how can I get a text from the second Div (complete Text) which is 'This is a sample text'. I tried getting text in #myDiv but it adds spaces before the phrase. I want to exactly get the text from the 2nd child element of the after #myDiv.
<div id='myDiv'>
<span> (this is second div)
<a name="aTag"></a>
<madcap:concept term="DoSomething">
This
<span class="myClass">
is a
</span>
sample text
</madcap:concept></h1>
</span>
</div>
please try with following-sibling xpath as below :
element(by.xpath("//*[following-sibling::div[#id='myDiv']]"))
Hope this works!
let text = await element(by.xpath('//div[#id="myDiv"]//span[1]')).getText();
console.log(text) 
worked fine for me
I added your html in component html and checked it.

Rendering HTML emails with inline CSS using Jinja

As you know, if you are going to send an HTML email, all CSS styling must be inline on the elements themselves e.g. <p style='font-family: Helvetica'>
Is there a way I can use Jinja to easily create HTML email bodies from Jinja templates without repeating CSS styles many times in a single template?
I think of setting these styles to variables e.g.
{% set FONT_STYLE = 'font-family: Helvetica; color: #111' %}
and then in the template I can do
<p style='{{ FONT_STYLE }}'>My paragraph here.</p>
Any better ideas? Maybe a library that resolves CSS rules that takes HTML content and CSS file and binds calculated CSS rules to the HTML elements one by one?
Look at premailer which turns CSS blocks into style attributes. You can get pretty html and convert it to email html with premailer.

rendering description saved using tinymce editor

I have a problem with pagination.
In my website , I have a function productList which generates a paginated list of products.
The code for the paginate function is shown below:
$this->paginate = array('conditions'=>array($otherconditions,$statuscondition,$active_condition,$catcondition),'order' => $order, 'limit' => 10);
In the view file,
the paginator helper is used as follows:
<div class="paginator">
<span class="info">
<?php echo $this->Paginator->counter(array('format' => __('Page <strong>{:page}</strong> of <strong>{:pages}</strong>')), array('escape'=>false));
?>
</span>
<ul>
<?php echo $this->Paginator->numbers(array('separator' => '', 'tag'=>'li'));?>
</ul>
</div>
Suppose, there are 150 products, so with a limit of 10, there will be 15 pages.
The problem is that the page numbers are not displayed in the end pages like page 15 i.e when I click on the page number 15, the products are displayed but the paginator counter and paginator number links are not displayed.
I have looked all over the net for a solution but could not find one. Please guide me.
PS: the paginate variable depends on my parameters like the category selected , and other conditions.
I dont think its a problem with the paginate syntax because the pagination works for small number of pages like 2 or 3.
The problem is with paginator helper I think.
Thanks in advance.
I have found the following line when I inspected the HTML. the page number and counter where commented automatically inside the following comments.
<!--[if gte mso 9]><xml>
<w:WordDocument>
<w:View>Normal</w:View>
<w:Zoom>0</w:Zoom>
<w:TrackMoves/>
<w:TrackFormatting/>
<w:PunctuationKerning/>
<w:ValidateAgainstSchemas/>
<w:SaveIfXMLInvalid>false</w:SaveIfXMLInvalid>
<w:IgnoreMixedContent>false</w:IgnoreMixedContent>
<w:AlwaysShowPlaceholderText>false</w:AlwaysShowPlaceholderText>
<w:DoNotPromoteQF/>
<w:LidThemeOther>EN-US</w:LidThemeOther>
<w:LidThemeAsian>X-NONE</w:LidThemeAsian>
<w:LidThemeComplexScript>X-NONE</w:LidThemeComplexScript>
<w:Compatibility>
<w:BreakWrappedTables/>
<w:SnapToGridInCell/>
<w:WrapTextWithPunct/>
< ...</p></div>
then after this I have the html for the page counter , page number links and also the script files. what is happening. I looked for its meaning and I found that mso 9 is microsoft office 9 or something. Which is not very reasonable. please guid me.
I solved this by putting a comment before the closing p tag and div tag.
So the comment tag <!--[if gte mso 9] > closes before </p></div>.
I also used the php function strip_tags to strip the body of text of all tags.
This is a duct tape method. But the problem I found lies in the mce editor.When a user copy pastes a paragraph from a word document to a mce editor thats running in firefox browser, the above mentioned conditional comment is added to the text. So, when displaying the user text, the conditional comment comments out rest of the html after the text.
IT is better to work with the mce editor callback to remove the conditional comment which i will be working on now.
Hope this helps someone...

UIWebView stringByEvaluatingJavaScriptFromString wrap tag with other tag

Let's say I have an HTML like this:
<html>
<form>
<input type="button" id="Signature8" pdfFieldName="Signature8" onclick="document.location='pdz://signatureTapped?name=Signature8'" />
</form>
</html>
and I want to replace it programmatically with
<html>
<form>
<img src="Signature8.png">
<input type="button" id="Signature8" pdfFieldName="Signature8" onclick="document.location='pdz://signatureTapped?name=Signature8'" />
</img>
</form>
</html>
in Objective-C with a UIWebView. What I did so far, is come up with this:
-(void) injectCode:(NSString*) code intoWebView:(UIWebView*) webView withEndCode:(NSString*) endCode {
NSString* innerhtml = [webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:#"document.forms[0].%#.outerHTML", self.identifier]];
NSString* newCode = [NSString stringWithFormat:#"document.forms[0].%#.outerHTML=%#%#%#", self.identifier, code, innerhtml, endCode];
[webView stringByEvaluatingJavaScriptFromString:newCode];
NSLog(#"%#", [webView stringByEvaluatingJavaScriptFromString:#"document.body.outerHTML"]);
}
which should be called like this:
[f injectCode:[NSString stringWithFormat:#"<img src=\"%#.png\" id=\"%#\">", f.identifier, f.identifier] intoWebView:self.webView withEndCode:#"</img>"];
(whereas f is an object that contains the name, identifier, etc. of that Signature8 field).
The problem is: this doesn't work. When I debug through it, I can see innerhtml filled, I can see that newCode is actually correct (to me at least) and I thought that the line that assigns outerHTML with newCode and all that should replace the whole HTML accordingly. To verify, I logged it out to the console. Yeah.. nothing changed at all.
Can anyone tell me what I'm doing wrong here? I cannot use jQuery or any other framework really, as the code should get its HTML forms from third parties and they do not have to use jQuery or anything like that.
You are just missing the quotes around the new html:
NSString* newCode = [NSString stringWithFormat:#"document.forms[0].%#.outerHTML=\"%#%#%#\";", self.identifier, code, innerhtml, endCode];
Remember outerHTML is expecting a string.
Well unfortunately not, but I found a solution with a proxy that can modify the HTML on the fly before I get it. Works as well :-)

Disabling data detectors for a specific HTML element in a UIWebView

Does anyone know if it's possible to disable the data detectors for phone numbers, email addresses etc in a UIWebView, for specific HTML elements only?
I'd like the detectors to be active for most of the content loaded into the UIWebView, but disable it in certain areas.
If this is possible, I'm assuming it would be achieved by using an HTML attribute in the loaded content (rather than setting some sort of UIWebView property), e.g.
<html>
<body>
<h1 datadetectors="off">Header text with number 9123 3456</h1>
<p>Body text with number 9872 4567</p>
</body>
</html>
In this example, the number in the <p> would be detected as a phone number due to setting webview.dataDetectorTypes = UIDataDetectorTypeAll, whereas the number in the <h1> would not.
you should use <meta name = "format-detection" content = "telephone=no">
Hope it helps
you can put the attribute
x-apple-data-detectors="false"
but unfortunately this seems to work only for tags.
I ended up using this solution:
666-777-777
besides disabling the telephone numbers "detection", this also prevents adresses and other detection to run.
If you control the web content you can use jscript (via jquery) to write your own data detectors. If you don't control the content you could insert and execute the jscript using stringByEvaluatingJavaScriptFromString: once webViewDidFinishLoad: is called.
In WKWebView Disable all Data Detector Types in Attributes inspector. This will solve your problem
Since an "a" tag will be inserted for you with the x-apple-data-detectors in it, you could write the tag yourself with x-apple-data-detectors set to false.
Original code:
<div class="my_time">17:02</div>
will be transformed to:
<div class="my_time">
<a href="x-apple-data-detectors://1" dir="ltr"
x-apple-data-detectors="true"
x-apple-data-detectors-type="calendar-event"
x-apple-data-detectors-result="1"
style="color: rgb(169, 169, 169);
text-decoration-color: rgba(169, 169, 169, 0.258824);">14:18
</a>
</div>
You can prevent this by writing your code as following...
<div class="my_time">
<a x-apple-data-detectors="false" style="text-decoration: none">17:02</a>
</div>