HTML Help & Support | Experts Exchange

Hi All

I'm trying to get the below code to work using html and javascript where it looks at a network drive called z: and shows the last photo taken (the file name varies, images created begin with "capt and end in a number, i.e. capt5578.jpg - wildcard needs to be used) based on timestamp, see below

<html>
<head>
</head>
<body>
<script type="text/javascript">
    function handleResponse(req) {
        if( req.readyState == 4 ) {
         document.getElementById('show').innerHTML = req.getResponseHeader("Last-Modified")
        }
    }
    function createRequestObject() {
        if(window.XMLHttpRequest) {
            req = new XMLHttpRequest();
        } else if(window.ActiveXObject) {
            req = new ActiveXObject("Microsoft.XMLHTTP");
        }
        return req;
    }
    function makeRequest()
    {
      var req = createRequestObject();
    	if (req) {
		req.onreadystatechange = function() { handleResponse( req ); };
		req.open("HEAD", "z:/capt*.jpg",true);
		req.send(null)
	}
    }
    function reloadImage() {
        var now = new Date();
        if (document.images) {
            document.images.myobject.src = 'z:/capt*.jpg?' + now.getTime();
            makeRequest()
        }
        setTimeout('reloadImage()', 15000);
    }
    setTimeout('reloadImage()', 0);
</script>
</body>
</html>

Open in new window

The issue here is I cannot get this to work. I'm not sure if I'm doing anything wrong here. Any help is greatly appreciated.

8 Comments

Hi Experts

Could you point how to configure this Bootstrap buttons to be correctly distributed accordingly with this layout?

<div class='row'>

      <div class="panel panel-primary">
      
          <div class='row'>
          
            <div class='col-md-8 pull-right'>
              <div class="btn-group" role="group">
                <button type="button" class="btn btn-primary" onclick="hotsite.vitrine.novo();">
                  <i class="fas fa-video" aria-hidden="true"></i> Minhas Fotos
                </button>
              </div>
            </div>
            
            <div class='col-md-6 pull-right'>
              <div class="btn-group" role="group">
                <button type="button" class="btn btn-primary" onclick="hotsite.vitrine.novo();">
                  <i class="fas fa-video" aria-hidden="true"></i> Todas as Fotos
                </button>
              </div>
            </div>
              
            <div class='col-md-4 pull-right'>
              <div class="btn-group" role="group">
                <button type="button" class="btn btn-primary" onclick="hotsite.vitrine.novo();">
                  <i class="fas fa-video" aria-hidden="true"></i> Enviar Foto
                </button>
              </div>
            </div>
              
          </div>  
       
    </div>
</div>

Open in new window

Thanks in advance!

7 Comments

Hi Experts

Could you point what's needed to change from video upload to image/photo upload on this view?

Accordingly to this code:

<div id='box-video' class='col-md-5 text-center'>

	<video controls style='width: 100%'>
		<source id='srcVitrine' src='' />
	</video>
	
	// Change to:
	<img controls style='width: 100%'>
		<source id='srcVitrine' src='' />
	</img>
	

	<div class='col-md-12 form-group'>
		<label for='titulo'>URL (Vídeo):</label>
		<div class="input-group">
			<input type='text' id='url' name='url' disabled class='form-control'/>
			<span class="input-group-btn">
				<button class="btn btn-primary" type="button" onclick='hotsite.vitrine.subirVideo();'><i class="fa fa-camera"></i></button>
			</span>
			<input type='file' id='file' name='file' style='display:none;'/>
		</div>
	</div>
</div>


<script>
  var jqXHRData;
  $(document).ready(function() {

    
    var pars = {
        _token:$('input[name="_token"]').val()
    };

    var resultImageUpload = function (data) {
        if (!data.result.erro) {
            localizacao = data.result.retorno.localizacao;
            $('#url').val(localizacao);
            $('#srcVitrine').attr('src', localizacao);
            
			
			// This runs
			$("#box-video video")[0].load();
			
			// This doesn't run
            $("#box-video img")[0].load();
					
            return false;
        } else {
          hotsite.openModalCustom("Erro",'Erro ao subir vídeo.', "Entendi", "error");
          return false;

Open in new window

…

2 Comments

hi am following this https://jasonwatmore.com/post/2018/10/29/angular-7-user-registration-and-login-example-tutorial am geting this error

1 Comment

module cannot be found but i do have it

2 Comments

Hi Experts

Could you point why this HTML textarea is not actualized when changing the pictures since JS scripts shows it has changed?

Accordingly to:

What occurs is:

Page Code:

  <div class="modal fade" id="mMidiaEditar" tabindex="-1" role="dialog" aria-labelledby="mMidiaEditarLabel">
    <div class="modal-dialog modal-lg" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
          <h4 class="modal-title" id="mMidiaEditarLabel">Mídia</h4>
        </div>
        <div class="modal-body">
          {{ csrf_field() }}
          <input type='hidden' id='id'/>
          <div class='form-group'>
            <label for='tituloEditar'>Título:</label>
            <input type='text' class='form-control' id='tituloEditar' name='tituloEditar'/>
          </div>

<!--  --->
          <div class='form-group'>
            <label for='descricaoEditar'>Descrição X:</label>
            <textarea class='form-control' id='descricaoEditar' name='descricaoEditar' rows="5"></textarea>
          </div>
<!--  --->

          <div class='form-group'>
            <label for='tipoparticipanteEditar'>Perfil:</label>
            <select id='tipoparticipanteEditar' name='tipoparticipanteEditar' class='form-control'>
              <option value='0'>Para todos os

Open in new window

…

9 Comments

Hi Experts,

I have always had issues with this, but how do I vertically center inner elements, such as a div within div?

CSS
HTML

1 Comment

I am using an application in Chrome and html code displays with tags, etc. If I go out of this option and in again the webpage has displayed but can anybody tell me if this is a setting somewhere in Chrome perhaps that causes it to load the html text first?
Thanks,

3 Comments

Hey There,

I need a little help tweaking my script for determining a State based on a Phone Number areacode.

I have a form, which when you enter the phone number, a hidden field will be populated with the state. The script is working if you enter the number in 111-111-1111 or 111111111 format, but if you do (111)-111-1111 or (111)111-1111 format, it displays none. So How do i tweak this, so it will pull the state regardless of the format. Website here - Website

form html

<div class="rounded-lp-form">
<div class="lp-form-header">
		<h1 style="text-align: center;">Schedule a demo</h1>
		<p style="text-align: center;"><span class="text-black">Already an existing customer?</span><br />
			<a href="https://buildertrend.com/company/contact-us/">Contact us here.</a>
		</p>
  </div>
  <form id="scedule-demo-lp-form" class="" action="https://go.buildertrend.com/l/464372/2020-02-04/7lw3vg" method="get">

<div>
    <input type="text" id="full_name" name="full_name" required placeholder="Full name" required/>
    <label for="full_name" class="hide-label">Full Name</label>
 </div>  
  <div>
    <input type="email" id="email" name="email" required placeholder="Email address" />
    <label for="email" class="hide-label">Email Address</label>
  </div>
  
<div>
	<input name="phone" id="phone" type="tel" placeholder="Phone number" required>
	<label for="phone"

Open in new window

…

12 Comments

One of the things I'm getting "dinged" on for the Google Insights Page Speed test is delivering images in Next Gen format. I realize this is WebP or JPEG200 [.jpf].

I am aware of the <picture> tag, (e.g. this link) but how would I use that tag in the following line of code:

<div class="slider-item js-fullheight" style="background-image: url('images/ExerciseAndEating-25.jpg');">

Open in new window

Thanks!

HTML

3 Comments

The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must be declared in the document or in the transfer protocol.

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <title>reCaptcha-test2.php</title>

    
  </head>
  <body>
    <?php
      echo "reCaptcha-test.php says hello"; 
      $url = 'https://www.themagnolia.com/reCaptcha-test-2.htm';
      $inputName;$inputEmail;$inputPhone;$inputMessage;$inputAddress;$inputCity;$inputState;$inputZipcode;$captcha;
      $captcha = filter_input(INPUT_POST, 'token', FILTER_SANITIZE_STRING);
        if (!$captcha) {
          <script>consol.log ("Quit No Captcha");</script>
          header ('location: https://www.themagnolia.com/reCaptcha-test-2.htm');
          exit ('Quit... token not found');
        }

        $secretKey = 'SECRET-KEY-GOES HERE';
        //$ip = $_SERVER['REMOTE_ADDR'];

        // post request to server
        $url = 'https://www.google.com/recaptcha/api/siteverify';
        $data = array('secret' => $secretKey, 'response' => $captcha);
        
        $options = array (
          'http' => array (
            'method'  => 'POST',
            'header'  => "Content-type:

Open in new window

…

5 Comments

After running the Google PageSpeed Insights several times, one of the first things I get "dinged" on is "Serve images in next-gen formats".

I read the directions: I took the image into Photoshop and saved as JPEG 2000 but when I replace that image in my HTML, no images show. This is true for both my local machine and in Production.

Aside from:

Changing the File format from .jpg to .jpf (in Photoshop)
Replacing the HTML (e.g. image2.jpf)

Is there something I am missing?

Thanks for your help.

...

2 Comments

LVL 14

Question by

HuaMin Chen

2020-02-09Solved

Adjust to code

Hi,
I want to have 2 more separate lines between word "Logon Page" and user name below. How to adjust it? How to also center "Logon Page" on the line?

        <div class="container" style="background:url('./pict/ID-10028343.jpg');border: 0px solid green;background-color: C9D3DD;background-size: cover;background-repeat: no-repeat;width:1200px;height:800px;font-family:Verdana;font-size:14px;">
          <form action="page.php" method="POST">
          <div class="row" style="border: 0px solid red;">
                <div class="col" style="border: 0px solid blue;"></div>
                <div class="col"></div>
                <div class="col text-center" style="border: 0px solid orange;foreground-color: 848484;font-size:18px;"><b>Logon Page</b></div>
                <div class="col"></div>

                <div class="col" style="border: 0px solid blue;"></div>
                <div class="col text-right" style="border: 0px solid orange;"><b>Username:</b></div>
                <div class="col" style="border: 0px solid yellow;"><input type="text" name="username" style="background-color: white;" /></div>
                <div class="col"></div>

                <div class="w-100"></div>

                <div class="col" style="border: 0px solid blue;"></div>
                <div class="col text-right" style="border: 0px solid orange;"><b>Password:</b></div>
                <div class="col" style="border: 0px solid yellow;"><input type="password" name="password"

Open in new window

…

51 Comments

Hello, I've found a behaviour of the ::after pseudo-element which I find strange and I'd like to ask you guys if there's an explanation and, most of all, a work-around.

Take a look here:
http://vetrina.ilgufoblu.net/test/

The two buttons are almost identical with completely identical css, but they behave differently on hover because the button on the left has an invisible span tag inside it which somehow makes the ::after pseudo-element position itself below the text instead of right after the text.

I don't understand how this is possible. The span has a "display: none;" attribute set and should not influence the layout in any way, as I understand it.

But it does, and the question I'm asking myself (and you) is why, and is there a way to avoid this?
I need that span (and more, actually) to be there to use some JS code which needs said spans to be right there (not included here because the problem is only with css).

I'll add the relevant code below, you can also check it out via your browser's dev tools.

Thanks.

HTML:

<body>
<div style="clear:both;padding:20px 0px 0px 200px;">
	<a title="Aggiungi al calendario" class="addeventatc" data-styling="none">
	    Sul Calendario
	    <span class="timezone">Europe/Rome</span>
	</a>
	<a title="Aggiungi al calendario" class="addeventatc" data-styling="none">
	    Sul Calendario
	</a>
</div>
</body>

Open in new window

CSS:

.addeventatc {
	background-attachment: scroll;
	background-clip: border-box;

Open in new window

…

2 Comments

I find that the following code doesn't work in IE. It works perfect in chrome or firebox. Any idea ?

div.map {
margin: 20px auto;
animation-name:rollmap;
animation-duration: 3s;
animation-iteration-count:infinite;
}

@keyframes rollmap {
      0% {background:url("../images/Map.png") no-repeat; }
      50% {background:url("../images/Maphover.png") no-repeat; }
      100% {background:url("../images/Map.png") no-repeat; }
}

CSS
HTML

8 Comments

Duplicate code removal with ReSharper?

I read it now helps highlight duplicate code, but at jetbrains.com I am not finding an specific feature for that.

At the moment, I care most about UI files, first and foremost HTML and Javascript.

Does anyone know if ReSharper highlight duplicate code within a file? And between different files?

IO am about to get the 30-day free trial. But, before I start the clock, I hope to nail down even if that feature exists.

Thanks

4 Comments

HI Team,

i am executing below code its working fine when i change the date then check particular row check box then submit. but it's not working when i clicked on check box first then change the date and submit . please tell me the solution of my problem thanx a ton in advance i m new in java script and jquery so please tell me particular solution on my code .

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet"
	href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
  
$(document).ready(function() {

	$(".date").datepicker({dateFormat:'dd/mm/yy'});
	$('.chkValues').on('click', function() {
		//get values of dates
		var array = [];
		var parent = $(this).closest('tr');
	    
	    // Now find all the child <inpu> elements with class "date"
	    var last = 0;
	    $('.date', parent).each(function(i,e) {
	      var dt = new Date(e.value.split("/").reverse().join("-"));
	      alert(dt);
	      console.log(dt.getTime());
	      if (dt.getTime() <= last) {
	        alert('Error: ' + e.id + ' has an invalid value');
	      }
	      last = dt.getTime();
	    });
		$row = $(this).data('row'); //row1, row2, row3 etc
		$('input.' +

Open in new window

…

15 Comments

LVL 1

Question by

ITsolutionWizard

2020-02-05Solved

HTML post to mvc

i have basic HTML form
Included one text box and one box for upload file

Do you have a sample code I can read to
Use JavaScript and Ajax to post both data into Mvc controller in net?

Thanks

3 Comments

I have a search button that shows a magnifying glass icon. When the user clicks the search button, I need to replace the magnifying glass icon (or it and the "Search" text, which ever is easiest) with a spinner/spinning .gif that I've been given. How can I do this with jQuery/javascript or which ever way would be best.

11 Comments

LVL 14

Question by

HuaMin Chen

2020-02-04Solved

Alignment issue

Hi,
I have the following and cannot show user name and password in center of lines. Please help.

<html>
    <body>
        <!--div align="center"-->
        <div class="container" style="background:url('./pict/ID-10028343.jpg') no-repeat center top; Height:780px; Width:1220px; background-size:100% 100%; margin:0 auto; ">
            <form action="page.php" method="POST">
    <script src="Scripts/jquery-3.0.0.min.js"></script>
    <script src="Scripts/bootstrap.min.js"></script>
    <link href="Content/bootstrap.min.css" rel="stylesheet" />
    <style>
        input {
            background-color: 00008B;
            width: 200px;
            display: block;
        }
        div {
            margin:10px auto;
        }
    </style>
    <div class="container">
            <div class="d-flex justify-content-center">
                <b>Username:</b><input type="text" name="username" /><br />
            </div>
            <div class="d-flex justify-content-center">
                <b>Password:</b><input type="password" name="password" /><br/>
            </div>
        </div>

                <input type="submit">
            </form>
        </div>
    </body>
</html>

Open in new window

17 Comments

Using jQuery or javascript, I need to toggle my spinner image. A button is clicked and on the back end a search is performed. Once that search starts I want to show my spinner image. When that search is finished I want to hid my spinner image. How do I do this?

my HTML

        <div class="divSpinner" id="divSpinner">
            <asp:Image ID="med_spinner" class="spinner" align="center" src="../images/medium_spinner.gif" runat="server" Visible="false" />
        </div>

Open in new window

2 Comments

hi experts

I am trying to update the version of my video player (ckplayer.com).
I have changed
line 7 and line 700 to 707 in here

But the player is not display.
Can you help me to check whats the problem?
Click here to see the original working video player.

3 Comments

LVL 1

Question by

WeTi

2020-02-03SolvedPrivate

PS create html to mailout color

Dear expert

Code below is from my last request.

Now I am creating this again, due to I close the last one... because it took too long time stays as opened due to my flu...
The script below works, well only in html form, now I would like to make this works as well in outlook as html in mailform, well of course I didn't mention it in the pre question my bad.

The code:
      tr[Critical="True"]                  {background-color: orange;}
      td[BatchEndedOK="False"]      {background-color: red;}
      td[FileMissing="True"]            {background-color: red;}

browser seems understand it, however not in html for outlook mail. Is there a solution to it?

Thanks alot again.

$arr = @'
"Batchname",	"TimeStamp",			"BatchEndedOK",	"FileMissing"
"H60",			"2020-01-27 13:00:55",	"True",			"False"
"H61",			"2020-01-27 13:00:55",	"True",			"False"
"H52",			"2020-01-27 09:39:00",	"True",			"True"
"T60",			"2020-01-27 09:00:22",	"False",		"True"
"T60",			"2020-01-27 09:00:22",	"False",		"False"
'@ | ConvertFrom-Csv | % {$_.BatchEndedOK = $_.BatchEndedOK -eq 'True'; $_.FileMissing = $_.FileMissing -eq 'True'; $_}

$outFile = '.\BatchReport.html'
$title = 'Batch Report'
$htmlHead = @'
<style>
	body	{background-color:white;font-family:verdana;font-size:12px;}
	table	{border-width: 1px;border-style: solid;border-color: black;border-collapse: collapse;}
	th		{border-width: 1px;padding: 0px;border-style: solid;border-color: black;padding:3px;background-color:#0dfc2d}
	td		{border-width: 1px;padding:

Open in new window

…

5 Comments

Hello

I purchased a Dashboard design but I am having a few issues with it;
I require to wrap the html elements in a form tag; but styling gets screwed up like below:

wrapping all html elements in a form tag.

Without wrapping the tml elements in a form tag it works like below:

without wrapping all html elements in a form tag.

For my purposes of using the template I need the elements wrapped in a form tag like in "wrapped_form_index.html", but I am unable to fix the issues or determine why the template stops working when being wrapped in a form tag.
Template site files are attached here: Template-Problem.zip
(files that applies to the website are located in /Scripts and /Styles)
- another minor issue is that the menu icons disappear in a position between full size and the mobile menu boundaries, if you have any idea where the css does this change please point it out as I would like to keep menu icons and not have three menu styling states.

5 Comments

I have a csv file containing name, address, email address, and a payment amount.

Fore each person in the csv file, I want to send a PDF receipt.
More precisely I want to send an email to the email address, with an attachment in PDF made from a html template filled with name, address and amount.

Tools I can use:
- MS Office or Libre Office on Windows
- I used VBA some years ago
- Linux/Bash shells

3 Comments

HTML

Related Topics

HTML

Related Topics