<div class="d-flex flex-column flex-sm-row justify-content-sm-start align-items-sm-center justify-content-start align-items-center card box-shadow RankItem">
<div class="d-flex flex-column justify-content-center align-items-center LeftSection">
<div class="rank RankNumber"><span>#</span>10</div>
<div class="score">SCORE 7.597</div>
<span class="ChgUp" style="display:none !important;"><i aria-hidden="" class="fas fa-arrow-circle-up" title="up"></i></span>
<span class="ChgDown" style="display:none !important;"><i aria-hidden="" class="fas fa-arrow-circle-down" title="down"></i></span>
<span class="d-flex flex-row align-items-center ChgNeutral" style="display:none !important;">
<i aria-hidden="" class="fa-stack fa-2x" title="no change">
<i class="fas fa-circle fa-stack-2x"></i>
<i class="fal fa-arrows-h fa-stack-1x fa-inverse"></i>
</i>
</span>
<span class="d-flex flex-row align-items-center">
<i aria-hidden="" class="fa-stack fa-2x" title="no change">
<i class="fas fa-circle fa-stack-2x"></i>
<i class="fal fa-arrows-h fa-stack-1x fa-inverse"></i>
</i>
2019 Rank 10 </span>
</div>
I want to scrape '2019' from this page source using beautiful soup.
I want only the number 2019.Please anyone help
Below is The answer for your question after i checked your previous questions and found by myself what you trying to achieve from this link https://www.vault.com/best-companies-to-work-for/law/top-100-law-firms-rankings/year/2020
from bs4 import BeautifulSoup
html = """
<span class="d-flex flex-row align-items-center">
<i class="fa-stack fa-2x" aria-hidden="" title="no change">
<i class="fas fa-circle fa-stack-2x"></i>
<i class="fal fa-arrows-h fa-stack-1x fa-inverse"></i>
</i>
2019 Rank 10 </span>
"""
soup = BeautifulSoup(html, 'html.parser')
for item in soup.findAll('span', attrs={'class': 'd-flex flex-row align-items-center'}):
item = item.text
print(item.strip()[0:4])
Output:
2019
Related
I am having the problem where my hx-target doesn't seem to be replacing the content where the target I point to. I'm using a a base html file that has a div with an id of requestcontent in it. All of my links, form actions and hx actions that I'm using point to this div for replacement.
My initial access from an item on the menu sidebar works fine and gives results as shown here:
Even when I click on the "Add bill" button the page renders correctly:
However if I press close or save on this page when I return to the original page the top of the add page is still present:
This is true from both my add and delete pages.
The initial page that starts out the entire process is in billlist.html
<div class="container shadow min-vh-100 py-2">
{% include 'acctsite/partials/messages.html' %}
<h2>Accounts Payable / Bills Listing</h2>
<div class="row" align="right">
<div class="col-10"></div>
<div class="col-2 pb-1">
<button class="btn btn-primary btn-sm"
hx-trigger="click" hx-get="{% url 'expadd' %}" hx-target="#requestcontent">
Add bill
</button>
</div>
</div>
<div class="row">
<div class="col h5">Date</div>
<div class="col h5">Vendor</div>
<div class="col h5">Description</div>
<div class="col h5">Amount</div>
<div class="col h5">Paid Info</div>
<div class="col-1"></div>
<div class="col-1"></div>
<div class="col-1"></div>
</div>
<div class="row">
<hr>
</div>
{% for bill in bills %}
<div class="row ">
<div class="col">
{{bill.date}}
{% if bill.due_date is not None %}
<br>{{ bill.due_date }}
{% endif %}
</div>
<div class="col">{{bill.vendor.name}}</div>
<div class="col">{{bill.description}}</div>
<div class="col" align="right">${{bill.amount|floatformat:2}}</div>
<div class="col">
{% if bill.paid_date is not None %}
{{ bill.paid_date }} <br>
{{ bill.check_number}}
{% endif %}
</div>
<div class="col-1">
<button class="btn btn-primary btn-sm" hx-trigger="click">Edit</button>
</div>
<div class="col-1">
{% if bill.paid_date is None %}
<button class="btn btn-primary btn-sm" hx-trigger="click" >Pay</button>
{% endif %}
</div>
<div class="col-1">
<button class="btn btn-danger btn-sm" hx-trigger="click" hx-get="{% url 'expdel' bill.transactionID %}" hx-target="#requestcontent" >Delete</button>
</div>
</div>
<div class="row">
<hr>
</div>
{% endfor %}
</div>
The add and delete page are very similar in the way they are written. Add uses a form to gather the information to perform the add:
expadd.html
<div class="container shadow min-vh-100 py-2">
{% include 'acctsite/partials/messages.html' %}
<h2>Add Expense/Bill</h2>
<form hx-post="{% url 'expadd' %}" hx-targe="#requestcontent" method="POST">
{% csrf_token %}
<div class="row">
<div class="col-2">
<strong>Vendor</strong>
</div>
<div class="col-5">
<select class="form-control" name="vendor">
{% for vendor in vendors %}
<option value="{{vendor.id}}">{{vendor.name}}</option>
{% endfor %}
</select>
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Date</strong>
</div>
<div class="col-2">
<input class="form-control" type="date" name="date">
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Due Date</strong>
</div>
<div class="col-2">
<input class="form-control" type="date" name="duedate">
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Description</strong>
</div>
<div class="col-5">
<input class="form-control" type="text" name="description">
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Amount</strong>
</div>
<div class="col-2">
<input class="form-control" type="number" step=".01" name="amount">
</div>
</div>
<div class="row">
<div class="col-5">
</div>
<div class="col-1">
<input class="form-control btn btn-secondary" type="submit" name="action" value="Close">
</div>
<div class="col-1">
<input class="form-control btn btn-primary" type="submit" name="action" value="Save">
</div>
</div>
</form>
</div>
expdel.html
<div class="container shadow min-vh-100 py-2">
{% include 'acctsite/partials/messages.html' %}
<h2>Confirm Expense Delete</h2>
<form hx-post="{% url 'expdel' %}" hx-targe="#requestcontent" hx-swap="outerHTML" method="POST">
{% csrf_token %}
<input type="hidden" name="tranID" value="{{ bill.transactionID}}">
<div class="row">
<div class="col-2">
<strong>Vendor</strong>
</div>
<div class="col-5">
{{ bill.vendor.name }}
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Date</strong>
</div>
<div class="col-2">
{{ bill.date }}
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Due Date</strong>
</div>
<div class="col-2">
{{ bill.due_date }}
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Description</strong>
</div>
<div class="col-5">
{{ bill.description }}
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Amount</strong>
</div>
<div class="col-2">
${{ bill.amount | floatformat:2 }}
</div>
</div>
<div class="row">
<div class="col-5">
</div>
<div class="col-1">
<input class="form-control btn btn-secondary" type="submit" name="action" value="Close">
</div>
<div class="col-1">
<input class="form-control btn btn-primary" type="submit" name="action" value="Delete">
</div>
</div>
</form>
</div>
The base template contains the definition of the page that contains the div id=requestcontent.
base.html
{% load static %}
{% load humanize %}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{% block title %}RJD Crew Accounting{% endblock %}</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap#5.2.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons#1.9.1/font/bootstrap-icons.css">
<style>
.hoverDiv {background: #fff;}
.hoverDiv:hover {background: #f5f5f5;}
</style>
{% block head %}
{% endblock %}
</head>
<body class="bg-light">
<nav class="navbar navbar-dark bg-primary navbar-expand-lg ">
<div class="container-fluid">
<div class="p-3 mb-2 bg-primary text-white">
<a class="navbar-brand text-white" href="{% url 'home' %}"><img src="{% static 'rjdcrew-logo.png' %}" height="50" ><br>Accounting</a>
</div>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse " id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item" >
<a class="nav-link {% if '/' == request.get_full_path %}active{% endif %}" href="{% url 'home' %}">Home</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Expenses
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item {% if 'expenses' in request.get_full_path %}active{% endif %}" href="{% url 'expenses'%}">Reimbursements</a></li>
<li><a class="dropdown-item" href="#">Bills</a></li>
</ul>
</li>
</ul>
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
{% if request.user.is_authenticated %}
<li class="nav-item">
<a class="nav-link" href="{%url 'logout' %}">logout</a>
</li>
{% else %}
<li class="nav-item">Register</li>
<li class="nav-item">
<a class="nav-link" href="{%url 'login' %}">Login</a>
</li>
{% endif %}
</ul>
</div>
</div>
</nav>
<div class="container p-10">
{% for message in messages %}
<div class="alert {{ message.tags }} alert-dismissible fade show" role="alert">
{{ message }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
{% endfor %}
</div>
<div class="container-fluid overflow-hidden">
<div class="row vh-100 overflow-auto">
<div class="col-12 col-sm-3 col-xl-2 px-sm-2 px-0 bg-light d-flex sticky-top">
<div class="d-flex flex-sm-column flex-row flex-grow-1 align-items-center align-items-sm-start px-3 pt-2 text-white">
<ul class="nav nav-pills flex-sm-column flex-row flex-nowrap flex-shrink-1 flex-sm-grow-0 flex-grow-1 mb-sm-auto mb-0 justify-content-center align-items-center align-items-sm-start" id="menu">
<li class="nav-item">
<a href="{% url 'home' %}" class="nav-link px-sm-0 px-2">
<i class="fs-5 bi-house"></i><span class="ms-1 d-none d-sm-inline">Home</span>
</a>
</li>
<li>
<a href="{% url 'reports' %}" class="nav-link px-sm-0 px-2">
<i class="fs-5 bi-speedometer2"></i><span class="ms-1 d-none d-sm-inline">Dashboard</span> </a>
</li>
<li class="dropdown">
<a href="#" class="nav-link dropdown-toggle px-sm-0 px-2" id="dropdown" data-bs-toggle="dropdown" aria-expanded="false">
<i class="fs-5 bi-credit-card"></i><span class="ms-1 d-none d-sm-inline">Expense Reimburse</span>
</a>
<ul class="dropdown-menu dropdown-menu-dark text-small shadow" aria-labelledby="dropdown">
<li><a class="dropdown-item" hx-get="{% url 'approve' %}" hx-target="#requestcontent">Approve</a></li>
<li><a class="dropdown-item" hx-get="{% url 'pay' %}" hx-target="#requestcontent">Pay</a></li>
<li><a class="dropdown-item" hx-get="{% url 'explist' %}" hx-target="#requestcontent">List</a></li>
<li>
<hr class="dropdown-divider">
</li>
</ul>
</li>
<li >
<a href="#" class="nav-link px-sm-0 px-2" hx-get="{% url 'billlist' %}" hx-target="#requestcontent" hx-swap="outerHTML" >
<i class="fs-5 bi-receipt"></i><span class="ms-1 d-none d-sm-inline">Expense Bills</span>
</a>
</li>
<li >
<a href="#" class="nav-link px-sm-0 px-2" hx-get="{% url 'payments' %}" hx-target="#requestcontent" >
<i class="fs-5 bi-journal-minus"></i><span class="ms-1 d-none d-sm-inline">Payments</span>
</a>
</li>
<li >
<a href="#" class="nav-link px-sm-0 px-2" hx-get="{% url 'journal' %}" hx-target="#requestcontent" >
<i class="fs-5 bi-currency-dollar"></i><span class="ms-1 d-none d-sm-inline">Journal</span>
</a>
</li>
<li class="dropdown">
<a href="#" class="nav-link dropdown-toggle px-sm-0 px-2" id="dropdown" data-bs-toggle="dropdown" aria-expanded="false">
<i class="fs-5 bi-printer"></i><span class="ms-1 d-none d-sm-inline">Reports</span>
</a>
<ul class="dropdown-menu dropdown-menu-dark text-small shadow" aria-labelledby="dropdown">
<li><a class="dropdown-item" hx-get="{% url 'checkreg' %}" hx-target="#requestcontent">Check Register</a></li>
<li><a class="dropdown-item" hx-get="{% url 'journalrep' %}" hx-target="#requestcontent">Journal</a></li>
<li><a class="dropdown-item" hx-get="{% url 'accountrep' %}" hx-target="#requestcontent">Accounts</a></li>
</ul>
</li>
<li>
<a href="#" class="nav-link px-sm-0 px-2">
<i class="fs-5 bi-people"></i><span class="ms-1 d-none d-sm-inline">Users</span> </a>
</li>
<li>
<a href="#" class="nav-link dropdown-toggle px-sm-0 px-2" id="dropdown" data-bs-toggle="dropdown" aria-expanded="false">
<i class="fs-5 bi-gear"></i><span class="ms-1 d-none d-sm-inline">Settings</span>
</a>
<ul class="dropdown-menu dropdown-menu-dark text-small shadow" aria-labelledby="dropdown">
<li><a class="dropdown-item" hx-get="{% url 'adduser' %}" hx-target="#requestcontent">Add User</a></li>
<li><a class="dropdown-item" hx-get="{% url 'addvendor' %}" hx-target="#requestcontent">Add Vendor</a></li>
</ul>
</li>
<li><i class="fs-5 bi-sign-stop"></i><span class="ms-1 d-none d-sm-inline">Sign out</span></li>
</ul>
</div>
</div>
<div class="col d-flex flex-column h-100">
<main class="row">
<div class="col pt-4" id="requestcontent">
{% block content %}
Content goes here
{% endblock %}
</div>
</main>
<footer class="row bg-light py-4 mt-auto">
<div class="col"> Copyright 2022 Skyout Services</div>
</footer>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap#5.2.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3" crossorigin="anonymous"></script>
<script src="https://unpkg.com/htmx.org#1.8.2" integrity="sha384-+8ISc/waZcRdXCLxVgbsLzay31nCdyZXQxnsUy++HJzJliTzxKWr0m1cIEMyUzQu" crossorigin="anonymous"></script>
<script src="{% static "dialog.js" %}"></script>
</body>
</html>
I want to extract holy place from <p class="answer"> <i class="fa fa-circle" aria-hidden="true"></i> holy place</p>
and plays from
<p class="answer"><i class="fa fa-circle" aria-hidden="true"></i> plays</p>
HTML Source Code
<div class="card card-custom custom-color">
<h1 class="card-header card-custom-font">A pilgrim is a person who undertakes a journey to a --- <br>
</h1>
<div class="card-body">
<div class="row">
<div class="col-sm-12">
<p class="answer"><i class="fa fa-circle" aria-hidden="true"></i> holy place</p>
</div>
<div class="col-sm-12">
<p class="answer"><i class="fa fa-circle-o" aria-hidden="true"></i> a mosque</p>
</div>
<div class="col-sm-12">
<p class="answer"><i class="fa fa-circle-o" aria-hidden="true"></i> a bazar</p>
</div>
<div class="col-sm-12">
<p class="answer"><i class="fa fa-circle-o" aria-hidden="true"></i> a new country</p>
</div>
</div>
<div class="card card-custom custom-color">
<h1 class="card-header card-custom-font">Shakespeare is known mostly for his--- <br>
</h1>
<div class="card-body">
<div class="row">
<div class="col-sm-12">
<p class="answer"><i class="fa fa-circle-o" aria-hidden="true"></i> poetry</p>
</div>
<div class="col-sm-12">
<p class="answer"><i class="fa fa-circle-o" aria-hidden="true"></i> novels</p>
</div>
<div class="col-sm-12">
<p class="answer"><i class="fa fa-circle-o" aria-hidden="true"></i> autobiography</p>
</div>
<div class="col-sm-12">
<p class="answer"><i class="fa fa-circle" aria-hidden="true"></i> plays</p>
</div>
</div>
My code
question_block = soup.find_all('div', attrs = {'class':'card card-custom custom-color'})
right_answer = question_block.find('p', attrs={'class':'answer','i':'fa fa-circle'}).get_text(strip=True)
Getting output: None
Thanks in advance and your answer will be highly appreciated.
Happy Coding :)
You want to call the appropriate css pattern on each question block. In this case .answer > .fa-circle will move you adjacent to the value you want, and next_sibling will then return the value you want:
from bs4 import BeautifulSoup as bs
html = '''your html'''
soup = bs(html, 'lxml')
question_blocks = soup.find_all('div', attrs = {'class':'card card-custom custom-color'})
for q in question_blocks:
# print(q)
print(q.select_one('.card-header').text)
print(q.select_one('.answer > .fa-circle').next_sibling.strip())
print('*' * 50)
I have taken you data as html where i have used css selector to locate element i tag and looping over it to find previous tag which contains correct answer text
from bs4 import BeautifulSoup
soup=BeautifulSoup(html,"html.parser")
main_div=soup.select("p > i.fa.fa-circle")
for data in main_div:
print(data.find_previous('p').text)
Output:
holy place
plays
You can directly select the p with class name answer and extract the text inside it.
x = soup.find('p', class_="answer")
print(x.text)
This code will extract only holy place and plays from p tags.
p = soup.findAll('p', class_='answer')
for i in p:
if i.text.strip() in ('plays', 'holy place'):
print(i.text.strip())
Output:
holy place
plays
I am looking to extract following url "https://mania.bg/p/pulover-alexander-mcqueen-p409648" from html (BeautifulSoup object) named urls that looks like:
[<a class="product sellout product-sellout float-left status-1" data-id="409648" data-producturl="https://mania.bg/p/pulover-alexander-mcqueen-p409648" data-status="1" href="https://mania.bg/p/pulover-alexander-mcqueen-p409648"> <div class="product-hover clearfix prevent-flicker"><div class="module-icons favourite tooltip" data-id="409648" data-title=" Любима находка на 24 клиент/и. "> <img alt="" class="favourite-product like-product unactivated" data-id="409648" src="dist/assets/icon_favourite_off.png"/></div> <div class="campaign" style="color: #FFF;background-color: #000000;"> NIGHT </div> <div class="profit-icons-wrapper clearfix"> </div> <div class="product-basic-info"> <div class="image-wrapper"> <img alt="Пуловер Alexander McQueen" class="front" data-url="https://media.mania.bg/product/048/409648/300/pulover-alexander-mcqueen-2.jpg" src="https://media.mania.bg/product/048/409648/300/pulover-alexander-mcqueen-1.jpg" title="Пуловер Alexander McQueen - Mania"> </img></div> <div class="clearfix brand-line"> <div class="brand float-left text-uppercase">Alexander McQueen</div> <div class="size float-right">S</div> </div> </div> <div class="prices-section"> <div class="prices-inner-section"> <div class="price-wrapper clearfix"> <div class="price-title text-uppercase float-left"> Начална цена </div> <div class="price old"> <span>98.00</span> <span class="currency">лв.</span> </div> </div> <div class="price-wrapper clearfix"> <div class="discount price-title text-uppercase float-left"> -40% </div> <div class="price old"> <span>58.80</span> <span class="currency">лв.</span> </div> </div> <div class="price-wrapper clearfix"> <div class="discount price-title text-uppercase float-left" style="color: #FFF;background-color: #000000"> -40% </div> <div class="price"> <span>35.28</span> <span class="currency">лв.</span> </div> </div> </div> </div> </div> <div class="button button-auction buy-now text-center float-left tooltip prevent-popup-close" data-id="409648" data-title="Може да добавите този продукт към количката.">ДОБАВЯМ<img alt="" class="bag-icon" src="dist/assets/icon_bag_button.svg"> </img></div> </a>]
With following code:
for num in range(len(urls)):
url = urls[num - 1].a['href']
I also tried to use:
url = urls[num - 1].a['data-producturl']
I get "TypeError: 'NoneType' object is not subscriptable" as url is None.
import requests
import bs4
url = 'https://mania.bg/p/pulover-alexander-mcqueen-p409648'
data = requests.get(url)
soup = bs4.BeautifulSoup(data.text,'html.parser')
urls = soup.find_all('a', attrs={'class': 'product sellout product-sellout float-left status-1'})
for num in range(len(urls)):
url = urls[num]['href']
print(url)
Try this. Here's an example:https://github.com/yiyedata/simplified-scrapy-demo/tree/master/doc_examples
from simplified_scrapy.simplified_doc import SimplifiedDoc
html ='''
[<a class="product sellout product-sellout float-left status-1" data-id="409648" data-producturl="https://mania.bg/p/pulover-alexander-mcqueen-p409648" data-status="1" href="https://mania.bg/p/pulover-alexander-mcqueen-p409648"> <div class="product-hover clearfix prevent-flicker"><div class="module-icons favourite tooltip" data-id="409648" data-title=" Любима находка на 24 клиент/и. "> <img alt="" class="favourite-product like-product unactivated" data-id="409648" src="dist/assets/icon_favourite_off.png"/></div> <div class="campaign" style="color: #FFF;background-color: #000000;"> NIGHT </div> <div class="profit-icons-wrapper clearfix"> </div> <div class="product-basic-info"> <div class="image-wrapper"> <img alt="Пуловер Alexander McQueen" class="front" data-url="https://media.mania.bg/product/048/409648/300/pulover-alexander-mcqueen-2.jpg" src="https://media.mania.bg/product/048/409648/300/pulover-alexander-mcqueen-1.jpg" title="Пуловер Alexander McQueen - Mania"> </img></div> <div class="clearfix brand-line"> <div class="brand float-left text-uppercase">Alexander McQueen</div> <div class="size float-right">S</div> </div> </div> <div class="prices-section"> <div class="prices-inner-section"> <div class="price-wrapper clearfix"> <div class="price-title text-uppercase float-left"> Начална цена </div> <div class="price old"> <span>98.00</span> <span class="currency">лв.</span> </div> </div> <div class="price-wrapper clearfix"> <div class="discount price-title text-uppercase float-left"> -40% </div> <div class="price old"> <span>58.80</span> <span class="currency">лв.</span> </div> </div> <div class="price-wrapper clearfix"> <div class="discount price-title text-uppercase float-left" style="color: #FFF;background-color: #000000"> -40% </div> <div class="price"> <span>35.28</span> <span class="currency">лв.</span> </div> </div> </div> </div> </div> <div class="button button-auction buy-now text-center float-left tooltip prevent-popup-close" data-id="409648" data-title="Може да добавите този продукт към количката.">ДОБАВЯМ<img alt="" class="bag-icon" src="dist/assets/icon_bag_button.svg"> </img></div> </a>]
'''
doc = SimplifiedDoc(html)
urls = doc.selects('a.product sellout product-sellout float-left status-1')
print ([(url.href,url['data-producturl']) for url in urls])
Result:
[('https://mania.bg/p/pulover-alexander-mcqueen-p409648', 'https://mania.bg/p/pulover-alexander-mcqueen-p409648')]
find_all already gives you the list of a elements; you just need to get the href from each.
from bs4 import BeautifulSoup
import requests
url = 'https://mania.bg/p/pulover-alexander-mcqueen-p409648'
r = requests.get(url)
soup = BeautifulSoup(r.content, 'html.parser')
for a in soup.find_all(
'a',
attrs={'class':
'product sellout product-sellout float-left status-1'}):
print(a['data-producturl'])
I am working with ASP.net MVC 5, I have created a bootstrap carousel/slideshow with 4 images, I want to get the id of the active slide on this carousel. Then, when an user is clicking on an submit button, I can redirect him to another page recording the active slide id in the URL.
<form method="post">
<div id="mycarousel" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#mycarousel" data-slide-to="0" class=""></li>
<li data-target="#mycarousel" data-slide-to="1"></li>
<li data-target="#mycarousel" data-slide-to="2"></li>
<li data-target="#mycarousel" data-slide-to="3"></li>
</ol>
<a class="carousel-buttonleft" href="#mycarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-buttonright" href="#mycarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
<div class="carousel-inner" role="listbox" style="height:300px">
<div class="item active" align="center">
<div align="center" class="carousel-image"><img src="../images/saumon.png" alt="saumon1" /></div>
<div class="carousel-caption">
<p>NORMAL SKIN</p>
</div>
</a>
</div>
<div class="item ">
<div align="center" class="carousel-image">
<img src="../images/saumon.png" alt="saumon1" />
</div>
<div class="carousel-caption">
<p>SILVER SKIN</p>
</div>
</div>
<div class="item " align="center">
<div align="center" class="carousel-image"><img src="../images/saumon.png" alt="saumon1" /></div>
<div class="carousel-caption">
<p>DEEP SKIN</p>
</div>
</div>
<div class="item " align="center">
<div align="center" class="carousel-image"><img src="../images/saumon.png" alt="saumon1" /></div>
<div class="carousel-caption">
<p>WITH SKIN</p>
</div>
</div>
</div>
</div>
Thanks.
sorry i'm currently using my phone. You must select by className.
In css :
.carousel-inner .item .active
In jQuery :
$('.carousel-inner .item .active')
then... .attr('id') and for the value .val() or .text()
In C#, I found this topic to show you how to iterate inside your page controls depending a specific className target :
StackOverflow
how to make the toolbar remains at the bottom, do not go up on top after the keyboard appears ??
what's wrong with my code or less some plugins for cordova or framework7! maybe someone can help me to solve this problem.
<div class="views">
<div class="view">
<div class="pages">
<div data-page="viewprofil" class="page navbar-fixed toolbar-fixed">
<div class="navbar" style="background-color: #1abc9c;box-shadow: 0 5px 10px rgba(0,0,0,0.1), 0 3px 6px rgba(0,0,0,0.1);">
<div class="navbar-inner" >
<div id="kembali" class="left sliding button">
<i class="icon icon-back"></i>
</div>
<div class="left sliding">Akun</div>
</div>
</div>
<div class="toolbar toolbar-bottom">
<div class="toolbar-inner">
<a id="kembali">
<i class="fa fa-home fa-2x" aria-hidden="true"></i>
</a>
<a href="{{pathFor 'history'}}" >
<i class="fa fa-clock-o fa-2x"></i>
</a>
<a href="{{pathFor 'viewprofil'}}" class="toolbar-aktif">
<i class="fa fa-user fa-2x"></i>
</a>
</div>
</div>
<div class="page-content" style="background-color: #ecf0f1;color: #444444;">
<div class="content-block-title" style="top: 0px; margin-top:0px;"><h2>Pengaturan Akun</h2></div>
<div class="list-block">
<ul class="box-data">
<li>
<div class="item-content">
<div class="item-media"><i class="icon material-icons">person</i></div>
<div class="item-inner">
<div class="item-input">
<input id="namalengkap" type="text" placeholder="Nama lengkap" value="{{nama}}">
</div>
</div>
</div>
</li>
<li>
<div class="item-content">
<div class="item-media"><i class="icon material-icons">email</i></div>
<div class="item-inner">
<div class="item-input">
<input type="text" value="{{email}}" disabled>
</div>
</div>
</div>
</li>
<li>
<li class="accordion-item">
<a class="item-content item-link">
<div class="item-media"><i class="icon material-icons" aria-hidden="true">lock</i></div>
<div class="item-inner">
<div class="item-title">Kata Sandi</div>
</div>
</a>
<div class="accordion-item-content">
<div class="content-block" style="margin-left: 80px;">
<input type="password" placeholder="Kata Sandi baru">
</div>
<div class="content-block" style="margin-left: 80px;">
<input type="password" placeholder="Ulangi Kata Sandi">
</div>
</div>
</li>
</li>
<li>
<div class="item-content">
<div class="item-media"><i class="icon material-icons">call</i></div>
<div class="item-inner">
<div class="item-input">
<input type="tel" placeholder="No. Handphone" value="{{notelp}}">
</div>
</div>
</div>
</li>
</ul>
<div class="content-block">
<div class="logButton button button-fill button-raised color-red" id="logout" ><i class="fa fa-power-off " aria-hidden="true"></i> Keluar</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
After
Before
I never came out of an idea to keep it in the bottom, but here is a quick fix:
var myApp = new Framework7({
material: true
});
var mainView = myApp.addView('.view-main', {
});
$$ = Dom7;
$$('#my-input').on('focus', function() {
mainView.hideToolbar();
});
$$('#my-input').on('blur', function() {
mainView.showToolbar();
});
Simply show and hide the toolbar on input focus and blur events.
Live Example: https://jsfiddle.net/wowq3n64/