Extracting all data from a list tag using HTML Agility Pack in C#

I am using the HTML Agility Pack to extract data. I want to extract all list items from the source:

<div id="feature-bullets" class="a-section a-spacing-medium a-spacing-top-small">

<ul class="a-unordered-list a-vertical a-spacing-mini">

<li><span class="a-list-item">
some data 1

</span></li>

<li><span class="a-list-item">
some data 2

</span></li>

<li><span class="a-list-item">
some data 3

</span></li>

<li><span class="a-list-item">
some data 4

</span></li>

</ul>

My code so far:

string source = someSource

var htmlDoc = new HtmlAgilityPack.HtmlDocument();
htmlDoc.LoadHtml(source);

How can I extract all the list items to get a result similar to this:

List value 1 is: some data 1
List value 2 is: some data 2
List value 3 is: some data 3
List value 4 is: some data 4

Go to Source
Author: Josie

Flask applicatio HTML Code Not Accessing Images

I have written a basic application in flask (in a docker image) which has an HTML page that needs to show two images. Due to some strange problem, the server is getting 404 errors for both of the images even though the images are at the right path. Attached are the screenshots of the directory output, and the error. Following is the HTML tag calling that image file:

<img src="input1.jpg" alt="" width="130" height="100" />

The directory structure in the container leading to the image:

apptemplatesinput1.jpg

The directory structure in the container leading to the HTML page is:

apptemplatesresult.html

Error line:

17.0.1 - - [29/Aug/2020 13:54:47] "GET /templates/input1.jpg HTTP/1.1" 404 -

Thank you.

Go to Source
Author: Muhammad Usman

Css problem with menu and submenu

I have a site in development:
https://destinopunilla.com.ar/beta2020

I have a main menu, and, when I move the mouse pointer over a menu option, the color change to yellow.. but, when I enter in a submenu, the color of the active menu option back to white.. How Can I do to stay that main menu option A and B in yellow while I navigate their submenus?

<ul id="menu-main-menu" class="...">
    <li id="nav-menu-item-43343" class="...">
        <a href="#" class=""><i class="nav-icon"></i><span class="menu-titles">OPTION A<span class="fa fa-angle-down"></span></span></a>
    
        <ul class="..." style="...">
            <li id="nav-menu-item-43392" class="..."><a href="#" class="..."><i class="nav-icon"></i><span class="menu-titles">SUBOPTION A 1</span></a></li>
            <li id="nav-menu-item-43393" class="..."><a href="#" class="..."><i class="nav-icon"></i><span class="menu-titles">SUBOPTION A 2</span></a></li>
        </ul>
    </li>
    <li id="nav-menu-item-43343" class="...">
        <a href="#" class=""><i class="nav-icon"></i><span class="menu-titles">OPTION B<span class="fa fa-angle-down"></span></span></a>
    
        <ul class="..." style="...">
            <li id="nav-menu-item-43398" class="..."><a href="#" class="..."><i class="nav-icon"></i><span class="menu-titles">SUBOPTION B 1</span></a></li>
            <li id="nav-menu-item-43399" class="..."><a href="#" class="..."><i class="nav-icon"></i><span class="menu-titles">SUBOPTION B 2</span></a></li>
        </ul>
    </li>
</ul>

Go to Source
Author: Ezequiel

How do I change the markup only of a built-in widget?

I’m developing a theme and I’d like to slightly alter some of the HTML output of some of the built-in widgets. As of now, I managed to change the sidebar search widget by creating a searchform.php file in my theme — though that might not only be the sidebar widget but alright.

I’m now onto the Archives widget. I literally just need to alter the bit that says “Archives” to change its tag and add a class. Do I really need to make my own (largely identical) class and register it and use my custom widget instead?

(If you can’t tell, I haven’t touched WP theming in around 10 years 🙂

Go to Source
Author: Morpheu5

several forms in 1 html file and closing a modal when data is valid

i am new to django and html along with css. created my html and css and now working on developing with django. I have 3 forms in 1 html file. login, register and forgot password. Have been breaking my head and couldn’t find a proper solution. what i did so far is create the register form (which is a modal done with css) but don’t know how to define a new form in the same html.
views file:

def index(request):
form = RegisterForm()

if request.method == 'POST':
    form = RegisterForm(request.POST)
    if form.is_valid():
        form.save()
        user = form.cleaned_data.get('username')
        messages.success(request, 'Membership was created for ' + user)
        return redirect('http://127.0.0.1:8000')

context = {'form':form}
return render(request, "index.html", context)

how to add another form which is under index.html?
also i tried the above method for the redirect to close the modal but it is not closing
appreciate someone’s help to explain to a newbie on the solution or provide some link with a solution. on how to add another form to the index.hml and hoe to close the modal once the form is valid and submitted

Go to Source
Author: rabih

jquery: adding rows at the bottom of a table make table y-scroll jump into to start position

I’ve created a “log viewer” method that contains a table with a fixed header; initially this method loads 200 lines into the table, and will load more lines on demand. If you scroll down (until certain y-scroll % ) method will do a request to server asking for a further 100 lines from bottom, then will catch these lines and append them at bottom of this table…

Similar behaviour is for the top if y-scroll reach certain % of table ‘y-scroll’ and the top line is not the initial line, it will request 100 (or the number of lines to the top if less than 100) and insert those lines into the top.

This is working perfectly so I’m very satisfied with it; as it is what I wanted.

All rows are kept in a “<tbody>” block

Now Here is my problem: in some occasions when method is adding new lines at the bottom of the table, the table ‘y-scroll’ jump from its position to start position which is not what I want, as it makes experience very annoying…

Expected behaviour will be: table y-scroll will move slightly up while is appending new rows into the bottom of the table.

This happens if you try to scroll yourself picking the scroll bar with the mouse and dragging it yourself, or pressing PgDown key, or pressing DownArrow Key…

Here is the code of this method:

$.getJSON(
        "get_logfile",
        {
          "logfile_hash_key": logfile_hash_key,
          "initial_line":  initial_line,
          "requested_rows": requested_rows,
          "web_request": true
        },

        function(data)
        {
              // I need to reverse the array to start inserting on the table, because otherwise inserted
              // lines will be reversed
              //
              // If request is from top...
              if (requested_rows < 0) {
                    new_initial = initial_line + requested_rows
                    if (new_initial < 0){
                        initial_line = 1
                    }
                    sinitial_line=document.getElementById("initial_line").attributes["data-value"]
                    sinitial_line.value = new_initial
                    starting_row = 0
                    data.reverse()
              }
              else { // if Request is from bottom...
                    new_final = initial_line + requested_rows
                    if (new_final > file_line_count) {
                         new_final = file_line_count
                    }
                sfinal_line=document.getElementById("final_line").attributes["data-value"]
                last_row_on_table=document.getElementsByClassName("tb-Log-Viewer")[0].rows.length - 1

                starting_row = -1

                sfinal_line.value = new_final

              }

              $.each(data, function(key,value) {
                    row = table.insertRow(starting_row)
                    cell=[]
                    for(cell_n=0; cell_n < value.length; cell_n++){
                        cell[cell_n] = row.insertCell(cell_n)
                        // verify cell has a "String" value
                        //
                        if (data[key][cell_n].__proto__ == "".__proto__) {
                            cell[cell_n].innerHTML = data[key][cell_n]
                            if (cell_n == 0) {
                               cell[cell_n].style = "text-align:center"
                               cell[cell_n].className = "Line"
                            }
                        }
                        // Check value for given cell is an array
                        //
                        if (data[key][cell_n].__proto__ == [].__proto__) {
                            cell[cell_n].innerHTML = data[key][cell_n][1]
                            attributes = data[key][cell_n][0].replace("style=","").replace(/'/g,"").trim().replace(" ",";")
                            cell[cell_n].style = attributes.replace("bgcolor=","background-color:")
                        }
                    }
              }
          )
        }
     )

Here is the HTML portion of this that define the table (All this is being generated by a python code):

...
<table class="logviewer" width="85%" border=1 cellpadding=10 cellspacing=0>
<thead class="th-Log-Viewer">
<style>
.Line {
   width: 70px;
}

.Timestamp {
   width: 170px;
}

.Severity {
   width: 80px;
}

.Message {
   width: 1800px;
}

</style>

<tr class="tr-Log-Viewer">
<th  class="header-Line">Line</th>
<th  class="header-Timestamp">Timestamp</th>
<th  class="header-Severity">Severity</th>
<th  class="header-Message">Message<div class="rows-data"><table><tr><td><span id="scroll-action"></span></td><td><span id="top-row"></span></td><td><span id="bottom-row"></span></td></tr></table></div></th>
</tr>
</thead>
<tbody class="tb-Log-Viewer" onscroll="Log_Viewer(this)">

<tr>
<td class="Line" style='text-align:center'><a id='1'>1</a></td>
<td class="Timestamp" style='text-align:center'>2020-07-07 08:19:48</td>
<td class="Severity" style='text-align:center' bgcolor=#3cb371>INFO</td>
<td class="Message" style='text-align:left'>[INFO ] 2020-07-07T08:19:48,516Z [main] cliutils.CliWrapperBase. - Application Args: generate-node-info</td>
</tr>

...
</tbody>
</table>

So what could be causing this table y-scrolling jump into starting position???

Thank you.

I’ve asked this question on StackOverflow but it has couple of weeks and no answer…

Go to Source
Author: Larry

Port Forwarding – Server responds to remote Java request, responds via local browser, can’t be reached in remote browser

I am hosting an Apache Tomcat instance on a server which is used to display a web page.
It needs to be remotely accessible via a browser.
The web page runs normally via localhost and I have setup port forwarding to make it remotely accessible.
I have tested the port forwarding with Java and successfully connected to the sockets.
Despite being able to connect to the socket, when I attempt to access it via a remote browser is returns “site can’t be reached”.

Locally
Local Browser – Web page runs as expected on localhost:8080

Remotely
Socket test – pass
Remote Java Request – Responds with full html of web page
Remote Browser – Site can’t be reached

Does anyone know why only the remote browser portion would fail, while remote requests sent through Java would work?

Go to Source
Author: jorbo

Is it safe to embed a google form on a website without an SSL Certificate?

I designed a Google Form for a website which does not have an SSL Certificate. I have planned to embed it onto a page using an iframe tag. I am currently testing it and have published a test page with the form, but when I fill out any of the fields Google Chrome says that the page is,

Not Secure

but it is in red unlike the normal grey.

The form is not asking for any information such as credit card numbers, but it is asking for name, email, and some other information.

Is this safe to embed the Google Form or does the site need an SSL Cerficicate?

Go to Source
Author: Vtex

How to enable HTML tags in category description without breaking the category page

I’m trying to include hyperlinks as part of the description on a category page.

Since WordPress strips the necessary HTML tags, I’ve added the following PHP code in a plugin, which stops the HTML tags from getting stripped:

add_action('init','disable_kses');

function disable_kses() {
    remove_filter('pre_term_description', 'wp_filter_kses');
    }

This lets me include HTML tags fine, but when I include a hyperlink in the description, it breaks the page in a weird way, with material from the description being reproduced above the header. This includes all the text from the first hyperlink until the end of the description, but the first link itself isn’t reproduced (only the text for it is). In addition, at the very end of the material, the following is appended to the text:

“>

Other than that, in the place where the description should appear (under the title), everything renders properly, including the hyperlinks.

The HTML that I use to include the hyperlinks is standard:

<a href="http://example.org/">example</a>

My question is what should I be doing differently in order to be able to include hyperlinks as part of the category page description?

Go to Source
Author: Thredolsen

interrogating this html element to retrieve value

im using selenium chromedriver to automate the filling in of a form. the last step is copying the final price. when i try to get text from the element i receive nothing.

below is a picture of the element in question. i want to pull a price from it.

[picture of problem][1]
[1]: https://i.stack.imgur.com/V6T1k.png

these lines:

print("read this")
print("---")
print(totalprice.text)    
print("---")
print(totalprice.get_attribute('innerHTML'))
print("---")
print(pricewrapper.text)
print("---")
print(pricewrapper.get_attribute('innerHTML'))

gives this output:

read this
---

---

---
Total Rental
£
excl. VAT
---
 <div class="col-sm-4 label-col"> <label for="TotalRegularPayment" class="ng-binding">Total Rental</label> </div> <div class="col-xs-10 col-sm-6 input-col"> <div class="input-group currency"> <span class="input-group-addon calculator-addon disabled-style" ng-class="{'disabled-style': ($ctrl.field.meta.is_read_only || $ctrl.isLockedDown)}"><currency-symbol class="ng-isolate-scope"><span class="ng-binding">£</span></currency-symbol></span> <input id="TotalRegularPayment" name="TotalRegularPayment" sr-money-focus-clear="" sr-money-value="" class="mousetrap form-control ng-pristine ng-untouched ng-valid ng-not-empty" tabindex="1" type="text" ng-model="$ctrl.field.value" ng-change="$ctrl.onChange()" ng-disabled="($ctrl.field.meta.is_read_only || $ctrl.isLockedDown)" disabled="disabled"> <!-- ngIf: $ctrl.field.meta.show_vat_label --><span class="input-group-addon vat-placeholder ng-binding ng-scope disabled-style" ng-if="$ctrl.field.meta.show_vat_label" ng-class="{'disabled-style': ($ctrl.field.meta.is_read_only || $ctrl.isLockedDown)}"> excl. VAT </span><!-- end ngIf: $ctrl.field.meta.show_vat_label --> </div> </div> <div class="col-xs-2 col-sm-2 text-center"> <sr-calculating-spinner field="$ctrl.field" calculator-id="$ctrl.calculatorId" on-calculate="$ctrl.calculate()" class="ng-isolate-scope"><!-- ngIf: $ctrl.field.meta.is_calculable && !$ctrl.quoteModel.is_quote_read_only --> <!-- ngIf: $ctrl.model.calculation_path === $ctrl.field.meta.name && $ctrl.model.is_calculating --></sr-calculating-spinner> </div> 

the element i want is total price but i also printed its wrapper to see if i got anything useful i didnt.
could you please advise on how i could print the price.

Go to Source
Author: tgm_jack_uk

In Jekyll need to pass reference to a site data set in front matter – but not as string, but with variable contents

This gives me two very different answers, on the variable of interest, “toc”:

Liquid Code to fetch right menu, based on front matter variable page.series

{% for item in site.data.tree-menus.tree %}
 {% if item.name == page.series %} 
   {% assign menu_type = item.link %}
 {% endif %}
{% endfor %}

Using Capture

{% capture toc %}{{menu_type}}{% endcapture %}
{{toc}}

Here toc returns the string:

site.data.tree-menu-1.tree

Note

site.data.tree-menus.tree is reference to a YAML file called tree-menus.yml that looks like the below. It is a reference to other YAML files which contain different menu navigations, e.g. Menu 1, Menu 2 (as I need to show a different side menu, depending on what page is loaded – refer to the top most liquid code snippet):

tree:
- name: Menu 1
  link: site.data.tree-menu-1.tree
- name: Menu 2
  link: site.data.tree-menu-2.tree

Using Assign

{% assign toc = site.data.tree-menu-1.tree %}

{{toc}}

Here toc returns the the contents of this yaml file, called “tree-menu-1.yml”:

tree:
- name: Level 1
  link: /docs/guides/level1.html
- name: 1. Level 2
  link: /docs/level2.html
- name: 2. Level 3
  link: /docs/level3.html

In the final bit of the code, I then pass in toc, to an include, which takes the content of the variable, to generate the Menu (in HTML)

Passing ToC variable into an include

{% include lhsTree.html nav=toc %}

PROBLEM

The problem is, the menu only generates using the assign method, and not the capture method.
For example if I do this,

{% assign toc = {{menu_type}} %}
{{toc}}
{% include lhsTree.html nav=toc %}

Toc will just be a string, it won’t hold the contents of Menu 1, (and the include will generate nothing. But the include is very happy when I do this

{% assign toc = site.data.tree-menu-1.tree %}
{{toc}}
{% include lhsTree.html nav=toc %}

How can I dynamically generate the correct menu, depending on what page is loaded, as I tried to do using the capture method above?

Go to Source
Author: Sachin

Adding HTML to posts with certain tags?

When I want to add a site-wide HTML code (before the closing tag) to each post and page in my site, I always go to my:

  • WordPress Panel > Customize > Theme Settings > Header/Footer Scripts > Footer Scripts

And paste the code there. Works perfectly fine.

But now I want to add this code only to my posts with certain tags. I tried this (tags are X Y and Z):

function wpb_hook_javascript_footer() {
  if (has_tag ('X' 'Y' 'Z')) { 
    ?>
          // My HTML Code goes here
    <?php
  }
}
add_action('wp_footer', 'wpb_hook_javascript_footer');

But I guess it doesn’t work (update keeps loading, never ends)?

Any words of wisdom?

Go to Source
Author: user190411

Is Tailwind the better option?

Is Tailwind a good option when it comes to designing instead of CSS? And is it acceptable in the software development industry? I recently discovered Tailwind while coding in ReactJS. The format of coding using Tailwind is very different and more flexible. However I am not sure if it can be applicable in the software industry.

Go to Source
Author: Munira Tashrifwala

How do I generate a div with select-option tags and some button on the click on a button?

So I have this code:
HTML
I want the generated div to be append to the div with class ‘members’
I also have two button: one to generate the div and the other to submit
My console shows me no error but the code won’t just work and it will freeze my browser
Any help??
This is my code

<main>
        <div class="members">

        </div>
        <form>
            <button class="addMember" type="button">Add Member <i class="fas fa-plus-square"></i> </button>
            <button type="submit" class="submit">Submit</button>
        </form>
    </main>

JS:

const generateDOM = function(e) {
    e.preventDefault();
    const memEl = document.createElement('div');
    memEl.classList.add("member")
    const counter = document.createElement('input');
    const num = document.createElement('input');
    const mem = document.createElement('select');
    let memOpt = document.createElement('option');
    const removeButton = document.createElement('button');

    //  setup the drop-down members
    for (let i = 0; i < totalInheritors.length;) {
        memOpt.value = totalInheritors[i];
        memOpt.text = totalInheritors[i];
        memOpt.classList.add('member-name')
        mem.appendChild(memOpt);
    }
    mem.classList.add('member-group')
    memEl.appendChild(mem);

    // setup the removeButton
    removeButton.innerHTML = '<i class="fas fa-trash"></i>';
    removeButton.classList.add("trash-btn");
    memEl.appendChild(removeButton);

    // setup counter attributes
    counter.setAttribute('type', 'range');
    counter.min = 1;
    counter.max = 10;
    counter.classList.add('mem-range')
    memEl.appendChild(counter);

    // setup counter attributes
    num.setAttribute('type', 'number');
    num.min = 1;
    num.max = 10;
    num.classList.add('mem-num')
    memEl.appendChild(num);

    // setting DOM elements
    memContainer.appendChild(memEl);
};

Note I wanna generate my options from an array of strings

Go to Source
Author: Truth