Articles → UIPATH → Get The Image URL From The Table Using Data Scraping In Uipath

Get The Image URL From The Table Using Data Scraping In Uipath

Scenario

Rendered Code

<table id="tab_16rwheOrvj" class="tabtable-rs_replaceimages" data-ruleset="rs_replaceimages.xml:rs_replaceimages_2">
	<tr class="tabrow tr_ht1">
		<td class="tabcol">Description</td>
		<td class="tabcol">Image</td>
	</tr>
	<tr class="tabrow ">
		<td class="tabcol">A nice car</td>
		<td class="tabcol">
			<a class="car.jpg" data-lightbox="car.jpg" href="/images/tabulizer/demo/car.jpg">
				<img class="example-image" alt="car.jpg" src="/images/tabulizer/demo/car.jpg">
			</a>
		</td>
	</tr>
	<tr class="tabrow ">
		<td class="tabcol">A pretty house</td>
		<td class="tabcol">
		    <a class="house.gif" data-lightbox="house.gif" href="/images/tabulizer/demo/house.gif">
			    <img class="example-image" alt="house.gif" src="/images/tabulizer/demo/house.gif">
			</a>
		</td>
	</tr>
	<tr class="tabrow ">
	    <td class="tabcol">An awesome guitar</td>
		<td class="tabcol">
		    <a class="guitar.png" data-lightbox="guitar.png" href="/images/tabulizer/demo/guitar.png">
			    <img class="example-image" alt="guitar.png" src="/images/tabulizer/demo/guitar.png">
            </a>
        </td>
    </tr>
</table>

Implementation

1. In UiPath studio, click on the "Data Scraping" button
2. A "Extract Wizard" window will appear

Click to Enlarge


3. Click on the "Next" button
4. An option will come to select the data. Select the first record of the table

Click to Enlarge


5. Another popup will appear to confirm if you want to extract the whole table. Click on "No"

Click to Enlarge


6. Another window will appear to select the second element. Click on the "Next" button

Click to Enlarge


7. Another option will come to select the data. Select the second record of the table

Click to Enlarge


8. Once you click on the second record, a window will appear to configure the column

Click to Enlarge


9. Without making any changes, click on the "Next" button
10. A preview data window will appear. Click on the "Edit Data Definition" button

Click to Enlarge


11. An XML editor will come. Change the XML text to

<extract>
	<row extract="1">
		<webctrl tag="tr"/>
	</row>
	<column exact='1' name='Column1' attr='text'>
		<webctrl tag='tr' />
		<webctrl tag='td' idx='1' />
	</column>
	<column exact='1' name='Column2' attr='src'>
		<webctrl tag='tr' />
		<webctrl tag='td' idx='2' />
		<webctrl tag='a' idx='1' />
		<webctrl tag='img' idx='1' />
	</column>
</extract>





Click to Enlarge


12. Click on the "OK" button
13. In the preview window, a list of URLs will appear

Click to Enlarge