Remove HTML code block from response using Javascript - javascript

I want to remove HTML code Block and CSS block from below code and get only XML code from above HTML code block. I want remove this HTML code block and want simple XML format code.
<FUSION-REPORT-FILE>
<REPORT-FILE>
<HEADER>
<DATE-OF-REQUEST>22-02-2021</DATE-OF-REQUEST>
<PREPARED-FOR>INS0000001</PREPARED-FOR>
<PREPARED-FOR-ID>ABCD</PREPARED-FOR-ID>
<DATE-OF-ISSUE>22-02-2021</DATE-OF-ISSUE>
<REPORT-ID>xxyzD8989</REPORT-ID>
</HEADER>
<REQUEST>
<NAME>ABX. XYZ</NAME>
<DOB-DATE>1991-01-01</DOB-DATE>
<PAN>PQR789895</PAN>
<PHONE>9819941920</PHONE>
<BRANCH-ID>59</BRANCH-ID>
</REQUEST>
</FUSION-REPORT-FILE>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Fusion Report</title>
<table>
<td width="150"></td>
<td align="left" width="300" valign="top">
<table border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td align="left" class="reportHead">FUSION REPORT
<br>
</td>
</tr>
</tbody>
</table>
</td>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</html>
I want a response as like below without HTML Code block; want remove this HTML code block and want simple XML format code as like below.
<FUSION-REPORT-FILE>
<REPORT-FILE>
<HEADER>
<DATE-OF-REQUEST>22-02-2021</DATE-OF-REQUEST>
<PREPARED-FOR>INS0000001</PREPARED-FOR>
<PREPARED-FOR-ID>ABCD</PREPARED-FOR-ID>
<DATE-OF-ISSUE>22-02-2021</DATE-OF-ISSUE>
<REPORT-ID>xxyzD8989</REPORT-ID>
</HEADER>
<REQUEST>
<NAME>ABX XYZ</NAME>
<DOB-DATE>1991-01-01</DOB-DATE>
<PAN>PQR789895</PAN>
<PHONE>9819941920</PHONE>
<BRANCH-ID>59</BRANCH-ID>
</REQUEST>
</FUSION-REPORT-FILE>

if you konw the root tag of xml, you can use slice function in javascript to get part of the string.
var str = `<FUSION-REPORT-FILE>
<REPORT-FILE>
<HEADER>
<DATE-OF-REQUEST>22-02-2021</DATE-OF-REQUEST>
<PREPARED-FOR>INS0000001</PREPARED-FOR>
<PREPARED-FOR-ID>ABCD</PREPARED-FOR-ID>
<DATE-OF-ISSUE>22-02-2021</DATE-OF-ISSUE>
<REPORT-ID>xxyzD8989</REPORT-ID>
</HEADER>
<REQUEST>
<NAME>ABX. XYZ</NAME>
<DOB-DATE>1991-01-01</DOB-DATE>
<PAN>PQR789895</PAN>
<PHONE>9819941920</PHONE>
<BRANCH-ID>59</BRANCH-ID>
</REQUEST>
</FUSION-REPORT-FILE>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Fusion Report</title>
<table>
<td width="150"></td>
<td align="left" width="300" valign="top">
<table border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td align="left" class="reportHead">FUSION REPORT
<br>
</td>
</tr>
</tbody>
</table>
</td>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</html>`
var resultXml = str.slice(str.indexOf("<FUSION-REPORT-FILE>"),(str.indexOf("</FUSION-REPORT-FILE>")+21));
console.log(resultXml);

Related

How to target a table based on ID, in order to iterate through its td-spans, and change spans color aswell as give out its value to console

I would like to target with JQuery a Table id, and iterate through this specific Table td-spans, in order to change spans color to red and also give out to it's value to console.
I tried the following Code, but the style property didn't work, nor did console.log()
$("span").each(function(index){
this.style.color="red"
console.log(this.innerHTML);
}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Jquery</title>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<table id="IDTable">
<tr>
<td>
<span>Hallo Welt</span>
</td>
</tr>
<tr>
<td>
<span>Hallo1</span>
</td>
</tr>
<tr>
<td>
<span>Hallo3</span>
</td>
</tr>
</table>
</body>
</html>
Your code is missing a closing );
Try the following.
$("#IDTable span").each(function(index){
this.style.color="red"
console.log(this.innerHTML);
});
The difference is the last line, where i'm closing the each function.
Try like this
$("#IDTable tr td span")
$("#IDTable tr td span").each(function(index){
this.style.color="red";
console.log(this.innerHTML);
});
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Jquery</title>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<table id="IDTable">
<tr>
<td>
<span>Hallo Welt</span>
</td>
</tr>
<tr>
<td>
<span>Hallo1</span>
</td>
</tr>
<tr>
<td>
<span>Hallo3</span>
</td>
</tr>
</table>
</body>
</html>
$("#IDTable td span").each(function(index){
this.style.color="red"
console.log(this.innerHTML);
});
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Jquery</title>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<table id="IDTable">
<tr>
<td>
<span>Hallo Welt</span>
</td>
</tr>
<tr>
<td>
<span>Hallo1</span>
</td>
</tr>
<tr>
<td>
<span>Hallo3</span>
</td>
</tr>
</table>
</body>
</html>

get last value of td whose class is same using jquery

I am working with jQuery. I have a html code like :
<table>
<tr>
<td class="price">price</td>
<td class="total">10 Rs</td>
</tr>
<tr>
<td class="price">Total:</td>
<td class="total">100 Rs</td>
</tr>
</table>
Now, I want only total price amount as 100 Rs. So what code should I have to write to resolve this?
try this
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>last demo</title>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<table>
<tr>
<td class="price">price</td>
<td class="total">10 Rs</td>
</tr>
<tr>
<td class="price">Total:</td>
<td class="total">100 Rs</td>
</tr>
</table>
<script>
alert($( "tr td:last" ).text());
</script>
</body>

Jquery Object #<Object> has no method 'getElement'

I have been trying to use set up this table here. http://www.ajaxblender.com/demos/tables/sortabletable/
I checked with my browser and the page is properly pulling the css and the .js files yet it gives me this error in reference to my sortabletable.js file
(screen shot of the error)
http://i.imgur.com/iJa2Rz8.png
Here is a copy of the relevant part of the source code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
<title>Home page</title>
<link rel="stylesheet" href="./_common/css/main.css" type="text/css" media="all">
<link href="sortableTable.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="./_common/js/mootools.js"></script>
<script type="text/javascript" src="sortableTable.js"></script>
</head>
<body>
<div id="container">
<div id="example">
<div class="tableFilter">
<form id="tableFilter" onsubmit="myTable.filter(this.id); return false;">Filter:
<select id="column">
<option value="1">Firstname</option>
<option value="2">Lastname</option>
<option value="3">Department</option>
<option value="4">Start Date</option>
</select>
<input type="text" id="keyword" />
<input type="submit" value="Submit" />
<input type="reset" value="Clear" />
</form>
</div>
<table id="myTable" cellpadding="0" cellpadding="0">
<thead>
<th axis="number">ID</th>
<th axis="string">Firstname</th>
<th axis="string">Lastname</th>
<th axis="string">Department</th>
<th axis="date">Start Date</th>
</thead>
<tbody>
<tr id="1">
<td class="rightAlign">1</td>
<td>Sam</td>
<td>Birch</td>
<td>Programming</td>
<td class="rightAlign">01/06/00</td>
</tr>
<tr id="2">
<td class="rightAlign">2</td>
<td>George</td>
<td>Lo</td>
<td>Support</td>
<td class="rightAlign">01/07/99</td>
</tr>
<tr id="3">
<td class="rightAlign">3</td>
<td>kevin</td>
<td>Walker</td>
<td>Programming</td>
<td class="rightAlign">01/06/05</td>
</tr>
<tr id="4">
<td class="rightAlign">4</td>
<td>Peter</td>
<td>Aland</td>
<td>Project Management</td>
<td class="rightAlign">23/10/06</td>
</tr>
<tr id="5">
<td class="rightAlign">5</td>
<td>Rachel</td>
<td>Dickinson</td>
<td>Design</td>
<td class="rightAlign">20/01/05</td>
</tr>
<tr id="6">
<td class="rightAlign">6</td>
<td>John</td>
<td>Tsang</td>
<td>Support</td>
<td class="rightAlign">05/10/05</td>
</tr>
</tbody>
<tfoot>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tfoot>
</table>
<script type="text/javascript">
var myTable = {};
window.addEvent('domready', function(){
myTable = new sortableTable('myTable', {overCls: 'over', onClick: function(){alert(this.id)}});
});
</script>
</div>
</div>
</div>
</body>
</html>
any thoughts on what it could be?
Use $.find('tbody') to get all descendant tbodys and $.children('tbody') to get all children tbodys. Try this:
this.thead = this.table.children('thead');
this.tbody = this.table.children('tbody');
this.tfoot = this.table.children('tfoot');
this.elements = this.table.find('tr');
Altough I don't see jQuery being loaded in your HTML sample, your question's title suggests that your are using jQuery in your site. If that's the case, your problem would be that there's a conflict between Mootools and jQuery because both libraries defines the $ function. To fix the issue, you will have to use jQuery.noConflict().

how to retrieve the value of TinyMCE

I have problems in 'textarea', I want to take the value of "TinyMCE" how can I take the value of "TinyMCE" with jquery
<td>
<textarea id="body" name="body" rows="20" cols="50" class="mceEditor"><c:out value="${article.body}"/></textarea>
<form:errors path="body" cssClass="fieldError"/>
</td>
this code after firebug
<table id="body_editor_tbl" class="mceLayout" cellspacing="0" cellpadding="0" style="width: 341px; height: 303px;">
<tbody id="">
<tr class="mceFirst">
<tr class="mceLast">
<td class="mceIframeContainer mceFirst mceLast">
<iframe id="body_editor_ifr" frameborder="0" src="javascript:""" style="width: 100%; height: 257px;">
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head xmlns="http://www.w3.org/1999/xhtml">
<body id="tinymce" class="mceContentBody " spellcheck="false" dir="ltr">
<br mce_bogus="1">
</body>
</html>
</iframe>
</td>
</tr>
</tbody>
</table>
how I can retrieve the value of TinyMCE,
karenasaya want to issue a message when tinymce is of no value, and will be ignored if no value
This will give you the contents of a tinymce editor
$('#your_editor_id').tinymce().getContent());

Change iFrame Source from separate iFrame with same parent?

Here's my full, latest code that doesn't work. Here's the main window HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Website</title>
<link rel="stylesheet" type="text/css" href="css/main.css" />
</head>
<body background="core_rec/web_res/cf2.jpg">
<center>
<table width="720" cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="180"><img src="core_rec/logos/metaltop.png" /></td>
<td colspan="3"><img src="core_rec/web_res/title.png" align="bottom"/></td>
</tr>
<tr>
<td width="180"><img src="core_rec/logos/metalbottom.png" /></td>
<td width="70"><center><font id="menutext">Menu</font></center></td>
<td width="100"><center><font id="menutext">Info</font></center></td>
<td width="200"><center><font id="menutext">Products/Services</font></center></td>
<td width="170"><center><font id="menutext">Contact</font></center></td>
</tr>
</table>
<br /><br />
<table height="80%" width="720">
<tr>
<td width="140"><iframe src="iframes/menus/main.html" width="140" id="sidebar"></iframe></td>
<td width="540"><iframe src="iframes/bodies/main/main.html" width="540" name="bodyframe" id="bodyframe"></iframe></td>
</tr>
</table>
</center>
</html>
Here's the menus/main.html. It contains the button.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>iFrame Main</title>
<link rel="stylesheet" type="text/css" href="../../css/main.css" />
</script>
</head>
<body bgcolor="#000000">
<center>
<font id="sidebartext">
Main<br /><br />
Other Feeds<br /><br />
<button onclick="parent.document.getElementById('bodyframe').src='../bodies/main/othersites.html'">Other Sites</button><br /><br />
</font>
</center>
</body>
</html>
Whenever I push the button on the menu frame, the body frame doesn't change.
Make sure to run this on a simple server and test. Many browsers have restrictions when it comes to iframes.
Many files don't work properly if using file:// protocol, which will be used if you directly open the html file (i.e.: Not through a server).
You misspelled getElementById: last letter d should not be uppercase.
Instead of window.document.getElementById you could write document.getElementById, because window is the global object in browser javascript (at least, global per window/(i)frame)
http://jsfiddle.net/kNrVL/

Categories

Resources