We help IT Professionals succeed at work.

HTML

60K

Solutions

31K

Contributors

HTML (HyperText Markup Language) is the main markup language for creating web pages and other information to be displayed in a web browser, providing both the structure and content for what is sent from a web server through the use of tags. The current implementation of the HTML specification is HTML5.

I have some display issues on the below code. Is it possible to align the label to the left  ? Beside, how to remove the quote (") for the text message ?Rating.png

<!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">
    
      <!-- Modal content-->
      <div class="modal-content" >
        <div class="modal-header">
          <center><h4 class="modal-title">Rating</center>
		  <button type="button" class="close" data-dismiss="modal">×</button>
        </div>
        <div class="modal-body">
          <div class="container-fluid">
				<div class="form-group input-group">
					<span class="input-group-addon" style="width:150px;">Rate:</span>
					<input type="text" style="width:350px;" class="form-control" id="rate">
					
				</div>
		  </div>
        </div>
        <div class="modal-footer">
		  <label id= "msg"  > </label>
		  <button id = "bRate" type="button" class="btn btn-default" onclick="UpdateRate()">Update</button>
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
      
    </div>
  </div>

Open in new window


<!-- JavaScript -->  
<script>
	$(function() {
		var myModal = $('#myModal').modal({show : false});
	 
		$('.showModal').click(function(e) {
			var movie = $(this).data('movie');
			$('#rate').val(movie.rating);
			
			myModal.modal('show');
		
		});
		
		$("#bRate").click(function(){
			var oReq = new XMLHttpRequest();  
			oReq.onload = function() {
				$('#rate').val(this.responseText);
				var text = this.responseText;
				$('#msg').html(this.responseText);
			};	
		
			oReq.open("get", "updateRate.php", true);
			oReq.send();
		});
		
	});


</script>

Open in new window

0
Any idea how to pass the field values in PHP into the fields of the modal form ?  Thx


<?php
include_once('navbar.php');
include_once('dbConnect.php');
?>


<html>
<head>
  <title>Movie Rating</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
   <link href="./css/fontawesome.css" rel="stylesheet">
  <link href="./css/brands.css" rel="stylesheet">
  <link href="./css/solid.css" rel="stylesheet">
</head>

<body>


<div class="container">
<?php

$sql= "SELECT a.movieId, a.title, a.image_path, avg(rating) from movies a left join ratings b on a.movieId=b.movieId  ";

if (isset($_REQUEST ['submit'])) {
      
    if (isset($_REQUEST ['search'])){
            $search = $_REQUEST ['search'];;
            $sql = $sql . " where a.title like '%" . $search ."%'";
            $sql = $sql . " or a.releaseDate like '%" . $search ."%'";
            $sql = $sql . " or a.runningTime like '%" . $search ."%'";
            $sql = $sql . " or a.genre like '%" . $search ."%'";
            $sql = $sql . " or a.description like '%" . $search ."%'";
      }
}      
      
      $sql= $sql . " group by …
0
on https://techgardens.com, the h3 tags are too small on mobile, something's changing them to 15px. Good example here: https://techgardens.com/privacy-policy/

I tried adding this to custom CSS, and it didn't help. Advice? Thanks.

/*increase size of h3 tags on mobile only*/
@media (min-width: 481px)  {  
h3, .h3-style {
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.25;
    font-family: Roboto, sans-serif;
    letter-spacing: 0em;
}
}
0
I would like to know how to create multiple language versions of an HTML page so that when a person comes to the page, the language of the person's browser is used to serve the page in that language.   My understanding is to use hreflang but not entirely clear on how it works.  I would also like to know how to structure the content in folders on the Web server to make all this happen.   Thank you!   Kind regards
0
I have an Access DB, running on an office PC.
I'd like have a webpage that displays data from this DB.
I have a shared drive that can be used so others can see this webpage - without directly addressing Access.
This page will be designed as a dashboard, and will have a wide variety of links, tables, charts.
How do I setup a connection & display the data?
Thank you in advance.
Russ
0
I have a javascript within html page that opens & reads a local CSV file into an array, so I can put values into a table.
An example I found opens up a dialog box, to allow the user to select a file.
As my filename will always be file.csv, can I skip this step?
<!DOCTYPE html>
<html>
    <head>
<script type="text/javascript">
                function loadFile(o)
                {

                    var fr = new FileReader();
                    fr.onload = function(e)
                        {
                            showDataFile(e, o);

                        };
                    fr.readAsText(o.files[0]);
                }

                function showDataFile(e, o)
                {
 var res = e.target.result.split(",");
var data1 = res[0];
var data2 = res[1];
var data3 = res[2];
var data4 = res[3];
var data5 = res[4];
var data6 = res[5];
document.getElementById("data1").innerHTML = data1; 
document.getElementById("data2").innerHTML = data2; 
document.getElementById("data3").innerHTML = data3; 
document.getElementById("data4").innerHTML = data4; 
document.getElementById("data5").innerHTML = data5; 
document.getElementById("data6").innerHTML = data6; 
//            document.body.innerHTML = '';


                }
</script>
 </script>
 </head>
 <body>
Select file to read <input type="file" onchange="loadFile(this)">
 
<table> 
  <tr> 
    <th>Month</th> 
    <th>Savings</th> 
  </tr> 
  <tr> 
    <td>January</td> 
    <td id="data1">$100</td>
  </tr> 
  

Open in new window

0
I am working on multi selectas per here http://demos.codexworld.com/multi-select-dropdown-list-with-checkbox-jquery/ this is working fine when I have appended the select values in the html. But when I dynamically add this is not working. Can some one help me

I have created a sample here with dynamic adding of options

https://codepen.io/dorababumeka/pen/VwwxVpe
0
Given the snippet of html  how do I create a JSON string from each img with class = 'MyClass' to give both  src  and data-img

HTML
<h1>Hello world!</h1>


<div>
  <div class='MyClass'><img src='//image.tmdb.org/t/p/w185/fw02ONlDhrYjTSZV8XO6hhU3ds3.jpg' data-img=1234></div>
   <div class='MyClass'><img src='//image.tmdb.org/t/p/w185/fw02ONlDhrYjTSZV8XO6hhU3ds3.jpg' data-img=5678></div>
</div>

</div>
<div id='res'>

</div>

Open in new window


JavaScript
const obj = {};
obj.test = [];
var el = document.getElementsByClassName('MyClass');
alert('el len ' + el.length);
for (var i = 0; i < el.length; i++) {
    var src = el[i].getAttribute('src');
    var data = el[i].getAttribute('data-img');
    obj.test.src = src;
    obj.test.data = data;
}
const json = JSON.stringify(obj);
document.getElementById("res").innerHTML = json;

Open in new window


Here is a jsfiddle
0
Hi,
I am new to this forum. I have a datatable with a dropdown in six of the columns. My problem is that when I click on each dropdown that column sorts and I do not want that. I would like that column to sort only when I click on the header and not the dropdown.
The functionality of the dropdown works as it should(meaning it only shows records for the item selected in the dropdown), but again I do not want sorting fired when just clicking on an item in the dropdown.

Here is the code. Since I am not sure how to post the html code to make it formatted properly, I also attached it. Thank you very much.


var table = $('#ticketTable').DataTable({
"stateSave": true,
"stateDuration": 0,
"autoWidth": false,
"columnDefs": [
{ "width": "40px", "targets": 0, "visible": true },
{ "width": "150px", "targets": 1, "visible": true },
{ "width": "250px", "targets": 2, "visible": true },
{ "width": "150px", "targets": 3, "visible": true },
{ "width": "53px", "targets": 4, "visible": true },
{ "width": "90px", "targets": 5, "visible": true },
{ "width": "53px", "targets": 6, "visible": true },
{ "width": "90px", "targets": 7, "visible": true },
{ "width": "90px", "targets": 8, "visible": true },
{ "width": "90px", "targets": 9, "visible": true },
{ "width": "90px", "targets": 10, "visible": true },
{ "width": "50px", "targets": 11, "visible": true }
],

//Create the dropdowns
    responsive: true,
    "bAutoWidth": false,
    initComplete: function () {
        

Open in new window

0
Hi,

How can I make a sub menu using my table menu?

I need a sub menu to Blended or Inpatient or Outpatient.
They each have a submenu. How can I do that?
This is my left menu.

I want on hover over the word "Blended" to list a submenu

 <table class="table">
                                                <tr>
                                                    <td>
                                                        <a id="RuleMenuDiv" href="../Rule" style="color:#0144af;">Rule</a>
                                                        </td>
                                                </tr>
                                                <tr id="BlendedMenu"> 
                                                    <td style="background-color:#5cb85c; color:#fff;font-weight:bold;">
                                                        Blended
                                                    </td>
                                                </tr>
                                                <tr id="InpatientMenu">
                                                    <td style="background-color:#5cb85c; color:#fff;font-weight:bold;">
                                                        Inpatient
                                                    </td>
                                                </tr>
                                                <tr id="OutpatientMenu">
                                                    <td 

Open in new window

0
I'm looking for a way to add copy/pasted CSS into my existing CSS without affecting what I've already written.
Here's the scenario:

Let's say I have css that reads:

body { .. something here }
h1 { ... }
.. I found some css (cards) that would fit great in my project, however, when I add them, they conflict with stuff already in there. To fix the problem, I tried wrapping everything in the html inside a .container.

My thought was that I could somehow add specificity by saying .container h1 , so it wouldn't conflict with my existing h1.
My question is:

Is there a shortcut to using that .container class in order to include all elements inside it, or do I have to go item by item and do .container h1, .container p, etc... ?
0
Date not printing in PDF.
I have a webpage and I have added the below code. I can see in the page but when I export to PDF its not coming in the document.
<p>&nbsp;</p>
  <p>Date: <span id="datetime"></span></p>
<script>
var dt = new Date();
document.getElementById("datetime").innerHTML = dt.toLocaleDateString();
  </script>

Open in new window


Appreciate if you can help me print in PDF
0
Hi
Is it possibly to load a JavaScript heavy webpage into a WebView (Not the native webBrowser as it can't load the page)
once the page is loaded "Click" programmatically each image with css class ="photo-item animated"   grabbing the resulting AJAX generated inoming html?

Or pass the entire document again looking for a new div with class="gallery"

This is as far as I've got but functionString  doesn't have a value  

        private void GetImgBtn_Click(object sender, RoutedEventArgs e)
        {
            SimulateClickAsync();
        }
        private async void SimulateClickAsync()
        {
            var functionString = string.Format(@"document.getElementsByClassName('photo-item animated')[0].click();");
            await WebViewControl.InvokeScriptAsync("eval", new string[] { functionString });
        }

Open in new window



BTW  searching for WebView returns pages about WebBrowser
0
Hi All,
Advance thanks!
i need help in displaying the input text box which shows text as image (like captcha text). I don't want to use recpatcha or any plugins, all need is stylesheet to make text box text to display as image which requires human eye to judge the letters!
<input class="InputField" autocomplete="off" type="Text" name="Question1" id="Question1" size="15" maxlength="10" onPaste="return false;"/>

Kind regards,
Pooja
0
Alex kindly helped me with the following:

Get-GPOReport -All -ReportType Xml -Path "C:\temp\GPOReportAll.xml"

I tried to use the same command on a Server running Windows Server R2 but it won't recognise the Get-GPOReport cmdlet and it won't let me import it.  I need to get a GPO Report from this server as it is our DC.

Since I was struggling I thought I would try to get the GPOReport  using our second DC running the following command:

Get-GPOReport -All -Domain "mydomain" -Server "SERVER01" -ReportType Html -Path "C:\GPOReportAll01.html"

However, all I get is the GPO from Server10 the server I am running the command from which is running Windows 12 R2.

Any help would be greatly appreciated.

Thanks.
0
Hello. I have a page where I am archiving newsletters.   On the right I have the newsletters listed and to the left I am displaying the most current edition.  The newsletters are just PDF files with multiple pages.  So to display them I used the <object> tag.  This is working but it is displaying the newsletters extremely small.  Even if I increase the width of the div the newsletter stays the same.  Can someone tell me what I'm doing wrong?

This is how I'm displaying the PDF file:
<div class="news_container">
        <div class="pdf_content">
            <object data="../../Newsletter/2019/CIDD_Newsletter_Issue_April2019.pdf" type="application/pdf" width="100%" height="100%">
                <p>Your browser does not support PDFs.
                <a href="../../Newsletter/2019/CIDD_Newsletter_Issue_April2019.pdf">Download the PDF</a>.</p>
            </object>
        </div>

Open in new window


This is how I'm displaying the list of newsletters:
<div class="newsletter_list">
            <div style="padding: 4px 0px 4px 6px;">
                <a href="../../Newsletter/2019/CIDD_Newsletter_Issue_April2019.pdf" target="_blank">Current edition (April 2019) &raquo;</a>
            </div>
            <div style="margin-top: 6px; padding: 3px 0px 3px 6px; background-color: #e5e5e5;">
                Past Editions
           </div>
            <div style="padding: 4px 0px 4px 6px;">
         <a href="../../Newsletter/2018/CIDD_Newsletter_Issue_November_2018.pdf" 

Open in new window

0
I have a dynamic table. The last item on a row is an href that is used to delete a row. If the user presses the tab key in the field before the last item, a new row is created. This works fine. But I need the cursor to go to the first field in the new row.  The cursor ignores the focus() and simply goes to the href delete button

Here is the HTML and PHP. The form may first be filled from a database table. Thus, the original ItemCount $i variable.

The function in question is under "EndCell Keypress"

HTML
So, you have here the initial row and possible additional rows on initialization.
<div class="parent-group">
    <div class="form-group">
        <div>
            <input type="text" id="FieldA(0)" name="FieldA[0]" />
        </div>
        <div>
            <input name="FieldB" id="FieldB" />
        </div>
        <div>
            <input type="checkbox" id="FieldC(0)" name="FieldC[0]" />
        </div>
        <div>
            <input type="text" id="FieldD(0)" name="FieldD[0]" class="EndCell" data-datarow=0 />
        </div>
    </div>   
    <div class="form-group">
        <a class="RowDeleteButton del" id="DeleteRow" href="javascript:void(0)"> X </a>
    </div>
</div>
<div id="container">
<?PHP
$ItemCount = count($FieldC);
if(!empty($_REQUEST['i']) || $ItemCount > 1)
{
    for($i=1;$i<$ItemCount;$i++)
    {
        echo('
        <div class="child-group">
            <div class="form-group">
                <div>
                   

Open in new window

0
hi
I've found a Javascript page that has promising HTML and JS code to do game touch moves and drags.

here

I'll put it up on my web tomorrow and see how it does. Is this the right solution?
HTML with UI objects that get branded with functionality in JS code?

How do coders do it so that touches and mouse clicks do the same thing?
I'd expect it is with helper methods with both of the listener types added?
I'd be preventing default, of course..
What can go wrong?

Thanks
0
I am creating the menu. The third row has 3 columns. However, the first column is hidden for some reason and I can not figured out how to make it to appear again

http://www.pcoltools493.com:81/
0
I would like to understand how to read and pull out specific information from a table in HTML.
The HTML file is provided as an attachment for your review and the basis for this question.

This HTML file has many tables but specifically I'm concerned about the Exxon Mobil Corporation condensed Consolidated Statement of Income table.   I even put it in a separate attachment shown as Table1.png with the value highlighted in yellow.  I'm specifically focusing in on the values $67,491 and $71,456 line items for Sales and other operating revenue for the years 2019 and 2018.

What I would like to do is identify the table's unique row value.   I'm looking for a commonality that when I parse out this html into a database form - I want to be able to associate that $67,491 value is with sales and other operating revenue specifically.  

Here's a snippet of code:

<us-gaap:Revenues
      contextRef="FROM_Apr01_2019_TO_Jun30_2019_Entity_0000034088"
      decimals="-6"
      id="ID_81A"
      unitRef="USD">67491000000</us-gaap:Revenues>
    <us-gaap:Revenues

Open in new window


And from this I can find several amounts that are under "FROM_Apr01_2019_TO_Jun30_2019_Entity_0000034088" to identify my unique value for the column going down.
However the row that this is related to and how it ties back to " Sales and other operating revenue" - I'm a little lost in identifying.

So when you look at the HTML there is a table and there is relationship but how do I go about finding that unique value for " Sales and other operating revenue" within the html doc I provide below?

Any steps in the right direction would be appreciated.
Table1.PNG
0000034088-19-000042-1-.html
0
Hi,

I'm asking a more refined Question, as suggested, after my other JS / css Q strayed...

I'm trying to connect an html that loads javascript code that is wrapped in a css style sheet.

The code works as I want it for now in jsfiddle, a mutalisk flight exercise, point and click movement. Small movement point and click works.
But I cant load it in Xcode IDE, or a browser, the same way. (no big, black rectangle border appears, as in the css, and the mutalisk doesn't move)
I need to know how to explicitly connect a style sheet with javascript.
The jsfiddle working initial html, css and JS code is here

In xcode, the mutalisk flies, but can't be click-moved, like in jsfiddle.

No black rectangle - means that the CSS isn't connecting.
I found this page below on how to explicitly include a style sheet into javascript. Nowhere in the jsfiddle code does the stylesheet get loaded.
Is this, below, the best/correct way to go?

here
?
Thanks
0
I need to have the mobile menu wider.  It's putting page names on two lines instead of one.

www.schuremediagroup.com


<body class="blog-standard home-demo-2">
<!-- PRELOADER -->
<div id="preloader"><div class="loader"></div></div>    
<!-- START HEADER SECTION -->
<section id="header">
    <!-- START MENU SECTION -->
    <div class="nav-menu nav-demo-1">
        <!-- NAV BAR BACKGROUND IMAGE-->
        <div class="section_bg_image" style="background-image: url(resources/images/01_Home.png)"></div>
        <!-- START NAV BAR-->
        <ul class="nav flex-column section">
            <li class="nav-item">
                <a class="nav-link" href="index.html">Home</a>
            </li>
            <li class="nav-item">
                <a class="nav-link active" href="21-Services.html">Services</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="javascript:void(0);">Videos</a>
                <ul class="child-item">
                    <li class="dropdown-child-item">
                        <a class="nav-link" href="06-Videos.html">Video List</a>
                    </li>
                    <li class="dropdown-child-item">
                        <a class="nav-link" href="07-Newest-Video.html">Newest Video</a>
                    </li>
                </ul>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="09-Music.html">Music</a>
            </li>
            <li 

Open in new window

0
Need to read page URL or change URL string parameters in the browser without reloading the page, for example on checkbox click event or page load.
Should be able to bookmark the page with all correct parameters.

Thank you in advance.
0
I am looking for a generic way of removing duplicates in my HTML output generated by Powershell scripts.

For example, say I have this data in a PS script:
cls

$convertParams = @{ 
 PreContent = "<H1>HTML Format test</H1>" 
 PostContent = "<p class='footer'>$(get-date)</p>"
 head = @"
 <Title>Event Log Report</Title>
<style>

td, th { border:0px solid black; 
         border-collapse:collapse;
         white-space:pre; }
th { color:white;
     background-color:black; }
table, tr, td, th { padding: 2px; margin: 0px ;white-space:pre; }
tr:nth-child(odd) {background-color: lightgray}
table { width:95%;margin-left:5px; margin-bottom:20px;}
h2 {
 font-family:Tahoma;
 color:#6D7B8D;
}
.footer 
{ color:green; 
  margin-left:10px; 
  font-family:Tahoma;
  font-size:8pt;
  font-style:italic;
}
</style>
"@
}

function CreateCollectionItem
{
    param([int]$pvalue, [string]$pValue2, [string]$pValue3)

    $newItem = New-Object System.Object
    $newItem | Add-Member -MemberType NoteProperty -Name "Col1" -Value $pvalue
    $newItem | Add-Member -MemberType NoteProperty -Name "Col2" -Value $pValue2
    $newItem | Add-Member -MemberType NoteProperty -Name "Col3" -Value $pValue3

    return $newItem
}

$data = New-Object System.Collections.ArrayList

$data.Add((CreateCollectionItem 1 "abc" "aaaaaaaa")) | Out-Null
$data.Add((CreateCollectionItem 2 "def" "ddddddddddddddddddddddddd")) | Out-Null
$data.Add((CreateCollectionItem 2 "ghi" "gg")) | Out-Null
$data.Add((CreateCollectionItem

Open in new window

0
How can I say in below code convert all fields into upper case ?

<!--  ----------------------------------------------------------------------  -->
<!--  NOTE: Please add the following <META> element to your page <HEAD>.      -->
<!--  If necessary, please modify the charset parameter to specify the        -->
<!--  character set of your HTML page.                                        -->
<!--  ----------------------------------------------------------------------  -->

<META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=UTF-8">

<!--  ----------------------------------------------------------------------  -->
<!--  NOTE: Please add the following <FORM> element to your page.             -->
<!--  ----------------------------------------------------------------------  -->

<form action="https://webto.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8" method="POST">

<input type=hidden name="oid" value="00D400000009UWY">
<input type=hidden name="retURL" value="http://">

<!--  ----------------------------------------------------------------------  -->
<!--  NOTE: These fields are optional debugging elements. Please uncomment    -->
<!--  these lines if you wish to test in debug mode.                          -->
<!--  <input type="hidden" name="debug" value=1>                              -->
<!--  <input type="hidden" name="debugEmail"                                  -->
<!--  value="dkelner@plasticade.com">                             …
0

HTML

60K

Solutions

31K

Contributors

HTML (HyperText Markup Language) is the main markup language for creating web pages and other information to be displayed in a web browser, providing both the structure and content for what is sent from a web server through the use of tags. The current implementation of the HTML specification is HTML5.