Menu

[Solved] Needs Assistance Add Detailsview Control Open Xex16productlist Web Application Downloaded Q37172416

needs some assistance

Add the DetailsView control Open the XEx16ProductList webapplication that you downloaded previously. This applicationcontains the starting page and the database, images, and stylesheets used by the page. Add a ListView control to the page, andcreate a data source that retrieves the Name and ImageFile columnsfrom the Products table, sorted by name. Configure the ListViewcontrol so it uses a flow layout. Enable paging and use a Numericpager. Edit the Item template and data pager Switch to Source Viewif you aren’t already there. In the Item template, delete the textthat identifies the two fields, as well as all the span elementsand line breaks. Replace the label control for the product image inthe Item template with an image control. Because the ImageFilecolumn contains just the name of the image file, you will need toadd the path to the ImageURL property like this_ImageURL='<%#”~/Images/Products/” + Eval(“ImageFile”) %>’Enclose the label control for the product name in a div element,and move that element after the image control. Modify the datapager so only 6 items are displayed at a time and so just thenumeric pager is displayed. Delete the templates that aren’t usedby this application. Then, run the application to see how it looks.Improve the formatting with Bootstrap In the Layout template,assign the div tag whose id is itemPlaceholderContainter to the CSSclass “row”. Then, assign the div tag that contains the data pagerto the CSS class “text-center”. In the Item template, change thedefault span tag to a div tag and then assign it to the CSS class”col-sm-4″. Then, add a second div tag inside the first one andassign it to the “thumbnail” CSS class. Move the image control andthe div tag that contains the label control inside the div tag youadded in step 11. Then, assign the div tag that contains the labelto the “caption text-center” CSS classes. Run the application tosee how it looks. Narrow and widen the browser to see how theimages behave.

Expert Answer


Answer to needs some assistance Add the DetailsView control Open the XEx16ProductList web application that you downloaded previous… . . .

OR


Leave a Reply

Your email address will not be published. Required fields are marked *