Solved

Splitting a string and storing each individual word in <ul><li></li></ul>

Posted on 2013-11-26
2
272 Views
Last Modified: 2013-11-26
Hi

I have a requirement where i want to split a text into chunks and show them in <ul><li></li></ul>
e.g I have

<specs><![CDATA[
Capacity: 4.7GB Speed: 3x Pack Style: 5 Pack Cartridge T2 The Type 2 Cartridge is a removable case for DVD-RAM. This disc is preformated in UDF 2.0
]]>
</specs>

And I want to display it as

Capacity: 4.7GB
Speed: 3x
Pack Style: 5 Pack Cartridge T2
The Type 2 Cartridge is a removable case for DVD-RAM.This disc is preformated in UDF 2.0
0
Comment
Question by:srikanth_saladi
2 Comments
 
LVL 30

Assisted Solution

by:Alexandre Simões
Alexandre Simões earned 250 total points
ID: 39676909
Here you go: http://jsfiddle.net/WgjcK/

<specs><![CDATA[
Capacity: 4.7GB Speed: 3x Pack Style: 5 Pack Cartridge T2 The Type 2 Cartridge is a removable case for DVD-RAM. This disc is preformated in UDF 2.0
]]>
</specs>

<div id="result"></div>

Open in new window

function toList(value){
    var capacity = value.substring(value.indexOf('Capacity'), value.indexOf('Speed'));
    var speed = value.substring(value.indexOf('Speed'), value.indexOf('Pack Style'));
    var packStyle = value.substring(value.indexOf('Pack Style'), value.indexOf('The Type'));
    var final = value.substring(value.indexOf('The Type'), value.indexOf(']]'));
    
    var result = [];
    
    result.push('<ul>');
    result.push('<li>' + capacity + '</li>');
    result.push('<li>' + speed + '</li>');
    result.push('<li>' + packStyle + '</li>');
    result.push('<li>' + final + '</li>');
    result.push('</ul>');
    
    return result.join('');
}
    
var value = document.getElementsByTagName("specs")[0].innerHTML;

document.getElementById('result').innerHTML = toList(value);

Open in new window


Be aware that this is highly hardcoded...
To make this safer you had to at least have a proper property separator, without that it's quite impossible to create a generic regexp that parses that properly.
0
 
LVL 109

Accepted Solution

by:
Ray Paseur earned 250 total points
ID: 39677373
Completely agree with @AlexCode -- this would make a lot more sense if you have a delimiter to separate the parts that you want to put into the list items.  The comma or vertical pipe is a traditional delimiter.

Please see: http://www.laprbass.com/RAY_temp_sree.php

<?php // RAY_temp_sree.php
error_reporting(E_ALL);

// THE TEST DATA
$xml = <<<ENDXML
<?xml version="1.0" ?>
<specs><![CDATA[
Capacity: 4.7GB Speed: 3x Pack Style: 5 Pack Cartridge T2 The Type 2 Cartridge is a removable case for DVD-RAM. This disc is preformated in UDF 2.0
]]>
</specs>
ENDXML;

// THE SIGNAL STRINGS
$signals = array
( 'Capacity'
, 'Speed'
, 'Pack Style'
, 'The Type'
)
;
// MAKE AN OBJECT AND EXTRACT THE TEXT
$obj = SimpleXML_Load_string($xml, "SimpleXMLElement", LIBXML_NOCDATA);
$txt = (string)$obj[0];

// ITERATE OVER THE SIGNALS
$cnt = count($signals) - 1;
foreach ($signals as $key => $sig)
{
    // LOCATION OF THE BEGINNING SIGNAL
    $alpha = strpos($txt, $sig);

    // THE LAST SIGNAL
    if ($key == $cnt)
    {
        $substrs[] = substr($txt, $alpha);
    }
    // EVERYTHING BUT THE LAST SIGNAL
    else
    {
        $omega = strpos($txt, $signals[$key+1]);
        $substrs[] = substr($txt, $alpha, $omega-$alpha);
    }
}

// CREATE THE HTML DOCUMENT
$out = '<ul>' . PHP_EOL;
foreach ($substrs as $str)
{
    $out .= '<li>' . trim($str) . '</li>' . PHP_EOL;
}
$out .= '</ul>' . PHP_EOL;

// SHOW THE WORK PRODUCT
echo '<pre>';
echo htmlentities($out);

Open in new window

Best regards, ~Ray
0

Featured Post

MIM Survival Guide for Service Desk Managers

Major incidents can send mastered service desk processes into disorder. Systems and tools produce the data needed to resolve these incidents, but your challenge is getting that information to the right people fast. Check out the Survival Guide and begin bringing order to chaos.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I imagine that there are some, like me, who require a way of getting currency exchange rates for implementation in web project from time to time, so I thought I would share a solution that I have developed for this purpose. It turns out that Yaho…
Part of the Global Positioning System A geocode (https://developers.google.com/maps/documentation/geocoding/) is the major subset of a GPS coordinate (http://en.wikipedia.org/wiki/Global_Positioning_System), the other parts being the altitude and t…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

825 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question